For mobile app i use only VH and VW

<div class="container"> <div class="title">Title</div> <div class="content">Content</div> <div class="footer">Footer</div> </div> .container { width: 100vw; height: 100vh; font-size: 5vh; } .title { height: 20vh; background-color: red; } .content { height: 60vh; background: blue; } .footer { height: 20vh; background: green; } 

Demo - https://jsfiddle.net/u763ck92/

For mobile app i use only VH and VW

<div class="container"> <div class="title">Title</div> <div class="content">Content</div> <div class="footer">Footer</div> </div> 

.container { width: 100vw; height: 100vh; font-size: 5vh; } .title { height: 20vh; background-color: red; } .content { height: 60vh; background: blue; } .footer { height: 20vh; background: green; } 

Demo - https://jsfiddle.net/u763ck92/