0

My screen resolution is 2560 x 1440. If I want a divs height to be (for example) 10% of my vertical screen resolution (144px) how would I do this?

I'm guessing this must be done with javascript...?

EDIT:

vw and vh are not what I need.

I need the entire screen resolution of my computer not of just the browser window which is what vw and vh do.

The question this post is similar to does indeed show users how to detect screen resolution, BUT not specifically how to use that screen resolution to modify a div in CSS.

Figured it out on my own...

<script>
    document.getElementById("div").style.height = screen.height + "px";
</script>
alecxe
  • 462,703
  • 120
  • 1,088
  • 1,195
Щąđε Яօɮɛʀֆօπ
  • 51
  • 9

1 Answers1

-1

you can do this by set the width and height by vh & vw CSS Units for example 100vh = 100% of the height of viewport 100vw = 100% of the width of viewport

or use the media query for example

@media screen and (min-width: 1024px) , screen and (min-height: 768px) {
    /* css for 1024px x 768px resolution and up */
}
Abdullah Ramadan
  • 182
  • 5