Padding: 1% to be equal of 1% body width

Question

I'm learning RWD by myself and I came up with idea to use 1% padding in almost every box/div/element, so the site always looks smart, is pixel-perfect and responsive. However, the 1% padding is based on PARENT ELEMENT's width, not on BODY's width. Is there any way to walk through this problem?

Answer 1

You can use the vh and vw css units of measure. This stands as the viewport height and and viewport width which 1vh is 1% of the viewport height.

The great thing about this is that it counts as a real dimension versus that of a percentage, which looks to a parent element.