Where to use 100vw; for example? Because

I saw many one about height: 100vh; for hero section is fine. But that width: 100vw; where is a good way or for a solution to use? Because not use a lot that property for sure! :slight_smile:

Any idea?

Thanks!

I suppose you would use it whenever you wanted an element to span the view’s entire width. For example, if you had a main div that you wanted to span the entire page, but not exceed it, you could you width: 100vw or width: 100%.

As you mention width: 100vw or width: 100%. What is difference? I mean vw is the max of visible screen size and 100% is from element about something like this not?
https://jsfiddle.net/ed73j82o/
Is correct way?

1 Like

That looks good to me. As for the difference, I had to look that up myself. I found this on StackOverflow: https://stackoverflow.com/a/25225716

He says the difference is vw takes the body’s margin into account whereas 100% does not include the margin.

I hope that helps.

2 Likes

Here is a bit more info
http://devblog.portland2030.org/2017/02/23/100-percent-vs-100vw/

1 Like