height: vh; does not work as it should on Chrome mobile

Question

height: vh; does not work as it should on Chrome mobile

Navigation

#1 by (1 votes)

1

Chrome is not tailoring content in the viewport

In Firefox and Opera mini you are adapting perfectly

Chrome

Firefox

Operamini

IsitpossibletomakeChromefitlikeFirefoxandOpera?

.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">	
	<div class="intro-noticia-1">
	 	<a href="#">
		<div class="intro-post-thumbnail">
		<div class="intro-noticia-main-caption">
			<h2></h2>
		<div>
			<span class="intro-main-caption-autor"></span>
			<span class="intro-main-caption-time"></span>
	  </div>
	 </div>
	 </div></a>
	</div>
 </div>

html css css3 height viewport

asked by anonymous 17.02.2017 / 22:38

1 answer

How to load image from javascript using base64? How do one array run inside another using functions?

score 1 · Answer 1

example:

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

The browser sees height: 200px, If the browser understands the drive vh, it will use 89vh instead of 200px;

I hope to have helped