All 4 CSS Viewport Units Explained

🌎 Find Me Here:

#Shorts

[marcinkalmar]

Really appreciate this short but meaningful video, sometimes we can lost to much time to set appropriate responsive page without knowledge like in this video.

[SponkADonk]

Amazing lol sitting here watching 15 minute video on this and then got bored... found this and understood it in the 1min run time... Thanks so much!

[hikolanikola]

i'm so glad that you actually made a video for that, it's about time to people to make web design's that always keeps their aspect ratio..
Been using them for years, and everyone looked at me like im some kind of alien..

[Trazynn]

This video was over before I started paying attention.

[IAmSamuelCharpentier]

% isnt a viewport unit, its a relative unit based on closes parent with sizing and relative position if I don't mistake.

[nclsDesign]

"entire screen size" doesn't actually mean "entire screen size" here. It's the window size (without tab bar, task bar etc). Please don't confuse this.

Edit: To all people that are about to put a toxic answer or anything underneath my comment:
There are beginners out there that maybe didn't properly understand it. I wrote this comment to clarify it for them.

Also if there is someone out there who doesn't know something simple, don't be toxic and flame them for it or something. You were a beginner too once and I'm 100% sure that you also asked a dumb question once and if someone explained it to you properly, that's great! If someone flamed you for it, then you know what it feels like and that's why you should be better.

Nobody can know everything.

[DesignwithCracka]

Well presented! Vmax and Vmin are awesome!

[romzamir]

0:38 this is not the full size of your screen, this is the full size of the window :)

[ZacharyPrice-usku]

Don't forget about dvb, dvh, dvi, dvmax, dvmin, and dvw :)

[justsomeordinarykid]

What's the point of vmin and vmax?

[ellisj]

Tbh I rarely use vw because if you have a div on the root level then 50% width will be 50% of the width of the screen anyway.

[SoreBrain]

Had to watch it twice, but good reminder

[movieshorts]

I have been wondering is it better to use em or rem for text . For div and containers elements vw, vh or maybe height : auto are better options

[nandohosp]

hey but why is 60VW that doesn't care about margins, actually leaving a space on the left side. Also confused by the 60VH as it should expand vertically.

[raph__y]

Hey, can you maybe help me? I´ve been watching your video "Your First Node.js Web Server" and I don´t know how to start the server even though I did everything as you did in your video. I always get an error in the terminal section.

[charlescoult]

Wish I knew about vmin and vmax a long time ago 😅

[easterling]

vh doesn’t work on IOS safari after resent iOS update :/ there is always an annoying gap if you scroll after opening side menu with 100vh

[vigneshyoga]

Bro if i use width= 100vh what is the real meaning
Because i am using these things for my portfolio’s media query mistakenly but the result was really surprised me because that was am expecting. I don’t know what happened can you please any one explain

[trentreimer]

Can we all petition Apple to accurately support viewport units? Safari's vh unit is brutally hit-and-miss.

If they don't feel they have the money to make that happen maybe they can at least hire an intern to peek at the Mozilla source code.

[megamonster]

please upload a full video of pagination using mongodb, mongoose, nodejs, ejs and plus the search and filtering