Viewport Percentage Units CSS HTML Layout Tutorial

Lesson Code: http://www.developphp.com/video/CSS/Viewport-Percentage-Units-CSS-HTML-Layout-Tutorial Learn to use the new viewport length values in CSS to siz…
Video Tutorial Rating: 5 / 5

Don’t forget to check out our other video tutorials or share this video with a friend.

0 votes

Loading... 3,323 views

14 responses to “Viewport Percentage Units CSS HTML Layout Tutorial”

1. Adam Khoury says:

   14/02/2015 at 7:23 am

   Reply
2. TheSabatuer says:

   14/02/2015 at 8:16 am

   I’m blown away that i didn’t know this, specifically cuz its game changing.
   when where these units introduced? and hows the browser support

   Reply
3. Xuryon says:

   14/02/2015 at 8:45 am

   I think its better to solve this with javascript by executing a function
   which sets the height to “window.innerHeight * 1” or “* 0.5”. Particularly
   if you are programing for mobile devices. On IOS for example, vh or vw is a
   litte bit buggy while changing the orientation.

   Reply
4. skmydkyafag says:

   14/02/2015 at 9:04 am

   Adam, thank you for your tutorials and keep up the great work!

   Reply
5. Ricky singh says:

   14/02/2015 at 9:21 am

   thank you adam khoury for this one, you really made my made

   Reply
6. Danylo Santoro says:

   14/02/2015 at 10:10 am

   Which browser i can use this news vw and vh?

   Reply
7. Marcel Robitaille says:

   14/02/2015 at 10:36 am

   Nice! I wasn’t aware of the viewport max and min units.

   Reply
8. Predrag Kostic says:

   14/02/2015 at 10:51 am

   Great one. Didn’t know those existed

   Reply
9. MrMrwilson11 says:

   14/02/2015 at 11:16 am

   I had not seen that yet. Thanks for showing it to us

   Reply
10. respon sive says:

    14/02/2015 at 12:12 pm

    very good tutorial thank you so much 🙂
    & can i download your channel videos?

    Reply
11. Stephan S says:

    14/02/2015 at 12:32 pm

    Nice tutorial. Totaly helped me out with those vh and vw!

    Reply
12. Dominic Maas says:

    14/02/2015 at 1:19 pm

    How did I not know this? What’s the browser support of this compared to
    calc()

    Reply
13. S A Bokhari says:

    14/02/2015 at 1:59 pm

    Reply
14. Kelly Burk says:

    14/02/2015 at 2:21 pm

    Something I frequently get asked is how to create a ‘responsive’ website
    layout. Here is a handy video to learn the basics of creating a responsive
    grid layout website. ~ ENJOY!

    Reply