The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Struggling with a liquid layout

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
  • #36183

    Hi everyone!

    I’ve been an avid CSS-Tricks reader ever since I began designing websites. I’ve finally made a site that I’m really pumped on, and would love some help making it a liquid layout, in this case meaning that it can resize automatically to the most common screen resolutions.

    The site is

    The issue is, when I was using max-height: 100% for the main image, it wouldn’t work in IE because the containing DIV would stretch to the right-side of the window. This would changing the % values of the divs that were used to trigger the “MY BODY” hover images based on the width of the window, and not the width of the max-height 100% div that contained the image. I wasn’t satisfied with using conditional statements and gobs of jquery to correct this, so I went with a different approach.

    My current solution is to declare a static width of the div that contains the main image, and then have jquery change the width of that div depending on the browser height, thus changing the %’s of all of the other div’s predictably, making it a somewhat-liquid layout.

    I would love any suggestions on making this website liquid, as well as any other feedback. This is my first time ever asking for feedback on a site, so if I am breaking any faux-pas on how to do this in the most tactful way, please excuse me! I am happy to provide code snippets, or any other things that may help.

Viewing 1 post (of 1 total)
  • The forum ‘CSS’ is closed to new topics and replies.