Row height depending on screen resolution ?

  • Thanks for reading.

    For the most part my site layout is Ok if the screen resolution is at least 1920 x 1080

    However if the screen resolution is say 1366 x 768 which a lot of laptops still are, then the images and page layout looks way too big and clunky.

    Is there a way to set row height / width based on the screen resolution ?

    In other words to get the template to dynamically resize (fit better) depending on the screen resolution of the user at that time.

    Thanks

    • This topic was modified 3 years, 1 month ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not an Developing with WordPress topic

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi @krammig.

    You can define custom rules with media queries or using the viewport size as unit

    Thread Starter Krammig

    (@krammig)

    @jose64 Thank you for taking the time to reply on this, appreciated.

    An interesting read. I sort of understand the concept after reading through both articles. Just now trying to find some actual examples I can mentally connect with my objective. Would happen to have come across any examples anywhere that you could point me to please ?

    Cheers

    Thread Starter Krammig

    (@krammig)

    Hello Jose,

    Would you be suggesting something like this. To have a different css file depending on the screen resolution ?

    <link rel="stylesheet" media="screen and (min-height: 1000px)" href="widescreen.css">
<link rel="stylesheet" media="screen and (max-height: 700px)" href="smallscreen.css">

    Not sure though how I would get this into a WordPress page though, or do I just add it in the Child page as overriding current settings ?

    I am looking at https://www.w3schools.com/cssref/css3_pr_mediaquery.asp

    Thanks

    • This reply was modified 3 years, 1 month ago by Krammig.
Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Row height depending on screen resolution ?’ is closed to new replies.