SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Stopping divs from wrapping on browser resize

    First view the example page: http://fantasykickoff.com, and then resize the browser to a small size, watch what happens to the colored squares.

    Now for the question: Is there a way to make the red, yellow and blue squares not wrap when the browser is resized. Instead of the page becoming a jumbled mess i would like a scroll bar to appear when it gets too tiny. I have asked several others and they all suggested the min-width and absolute positioning solutions, but i cant use these in this situation. It would take too long to explain why i cant use those two solutions.

    Is there any way to stop the page from geting messed up besides the things ive already listed? Any CSS gurus out there with the answer??

  2. #2
    Non-Member deathshadow's Avatar
    Join Date
    Jul 2006
    Location
    Dublin, NH
    Posts
    901
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    add a width to the parent DIV for the three boxes...

    Let's see.... those three are each 200 pixels wide, there's another item in the same parent that's 30 pixels wide, you have 1 pixel borders around everything, so change the parent to have a width:638px; That should do the trick.

  3. #3
    #titanic {float:none} silver trophy
    molona's Avatar
    Join Date
    Feb 2005
    Location
    from Madrid to Heaven
    Posts
    8,223
    Mentioned
    237 Post(s)
    Tagged
    1 Thread(s)
    I don't know if this will work, but I would also give a try to the overflow property. Use it on the parent div and set it to auto

  4. #4
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I would rather not set a width to the parent div because the inner divs will be on varying widths. My example has them at 200px, but in reality, they'll vary from page to page. I would like the parent div to be as wide as minimally possible.

    I experimented with a setting overflow, but none of it worked.

  5. #5
    Non-Member
    Join Date
    Jan 2005
    Location
    Netherlands
    Posts
    4,300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello

    min-width on body or wrapper, IE needs expressions
    see FAQ CSS
    http://www.sitepoint.com/forums/show...1&postcount=25


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •