высота: vh; не работает, как это должно быть в мобильном хром

Question

Chrome не адаптируя содержание в видовом

В светлячок отлично работает

Я тестировал на Opera Mini тоже, и это также работает. Но я не могу отправить более чем 2 ссылки

Chrome

Firefox

Возможно ли хром адаптировать как оперы и светлячок?

.intro-noticias { 
 
    width: 100%; 
 
    height: 89vh; 
 
    margin-top: 70px; 
 
} 
 

 
.intro-noticia-1 { 
 
    width: 50%; 
 
    height: 100%; 
 
    float: left; 
 
    border-right: 2px solid #000; 
 
    position: relative; 
 
} 
 

 
@media only screen and (max-width: 500px) { 
 
.intro-noticia-1 { 
 
    width: 100%; 
 
    height: 100%; 
 
    border-bottom: 2px solid #000; 
 
} 
 

 
}

<div class="intro-noticias"> \t 
 
\t <div class="intro-noticia-1"> 
 
\t \t <a href="#"> 
 
\t \t <div class="intro-post-thumbnail"> 
 
\t \t <div class="intro-noticia-main-caption"> 
 
\t \t \t <h2></h2> 
 
\t \t <div> 
 
\t \t \t <span class="intro-main-caption-autor"></span> 
 
\t \t \t <span class="intro-main-caption-time"></span> 
 
\t </div> 
 
\t </div> 
 
\t </div></a> 
 
\t </div> 
 
</div>

Answer 1

Может быть вашим margin-top, что бросает его? Calc может быть решением

.intro-noticias { 
    width: 100%; 
    height: calc(100vh - 70px); /* The full view port height minus the margin */ 
    margin-top: 70px; 
}