Is there anything wrong to setting the size of everything to View Port Height?

Fonts, padding, pictures, borders and everything else.

I am new and I am playing around with how my site looks in my browser when I zoom in and out.

Since am using big fonts and lots of white space I don’t like the way my text, like my headings change as I scale in and out.

I found the best solution is to use VH to keep the look I want. I was wonder if there are any problems using VH with everything?

It seems VH is always 100% but VW is in pixels. So as the page gets wider ( more pixels) the text takes up less space. So setting size ton VW doesn’t maintain they symmetry of my text layout.

I just want to know if it is safe to use VH for everything as default?

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

As with everything on the web, it depends.
For most project, you’d want to use the right units, where appropriate.

  • vw and vh are good for layouts that need to scale relative to the size of the page, but consider that a monitor typically has a landscape orientation, while a phone is often portrait. With vw and vh that would suddenly change your canvas from short+wide to tall+narrow.
  • percentages are often better for layouts that are relative to parent objects.
  • rems and ems are likely a better choice for most fonts and padding.
  • pixels may be a better choice for border widths, rounded corners, etc.

There are no hard rules, so experiment and learn what works for you.

These might help you go deeper on developing your choices too.