Height:auto problem with wrapper!

Discussion in 'CSS' started by scutari, Oct 14, 2008.

  1. #1
    here is my problem..I used a wrapper to wrapp some divs but for some reason the background color of the wrapper won't show in ff3 and opera 9.5 while perfectly showing in ie7...

    the properties to the wrapper here:

    As you see I am using a background color(not image) so...I can set a weight and it will work but while content changing(while added) makes the divs inside wrapper go out of it...

    should I be using min and max height for this or does anyone have any solution?
     
    scutari, Oct 14, 2008 IP
  2. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #2
    You don't say, but I'll wager you have float content in that div, right? IE has a WAD bug that is triggered by the width property. Modern browsers don't enclose float elements without specific instructions.

    See containing float elements for an explanation.

    In the future, please post all your code or give us a link.

    cheers,

    gary
     
    kk5st, Oct 14, 2008 IP
  3. scutari

    scutari Peon

    Messages:
    431
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    0
    #3
    well probably i would give a link, but I have my code locally and cannot tell...but for sure I have float...the elements are floated right and left...
     
    scutari, Oct 14, 2008 IP
  4. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #4
    In that case, the article I linked should solve your problem.

    cheers,

    gary
     
    kk5st, Oct 14, 2008 IP
  5. scutari

    scutari Peon

    Messages:
    431
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    0
    #5
    thanks It really helped...with the overflow auto..
     
    scutari, Oct 14, 2008 IP
  6. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #6
    Dude, you called clearfix ELEGANT?!? Whiskey Tango Foxtrot?!?
     
    deathshadow, Oct 14, 2008 IP
  7. scutari

    scutari Peon

    Messages:
    431
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    0
    #7
    what do you mean by that?
     
    scutari, Oct 14, 2008 IP
  8. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #8
    Yes, I do. There is no one method of enclosing float elements that will work for every occasion. There will be times when an explicit clear rule needs to be invoked within the parent container. In those cases, Tony Aslett's clearfix solution is very elegant, adding no new structural elements to the html. Thus, it remains orthogonal.

    At its inception, before widespread understanding of new block formatting contexts, it was the only reasonable method for a purely css based enclosure of float elements. With a broader understanding of our options, we need the clearfix method only rarely, but we do need it.

    We can forget IE/Mac now, which simplifies the hack, and our better knowledge of IE's hasLayout also leads to simplification (think Claire Campbell's tripswitch hack), making it even more elegant than when it arrived.

    Triggering a new block formatting context comes with plenty of gotchas that will certainly bite the unwary right on the butt. While a more experienced coder can tell the newbie to do {overflow: hidden;} on an element with confidence, that newbie can create a world of confusion for himself when he tries using it on his own. The clearfix hack is a rather benign solution that rarely causes problems.

    gary
     
    kk5st, Oct 14, 2008 IP
  9. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #9
    Better to have a page state the various clearing methods like the old PIE site did... starting off with the "bad one", why it works, and why it sucks, and go on through the list... it's handy to have a list of clearing tools just like it's handy to have a list of Haslayout triggers. I've been using Haslayout.net/haslayout's list but I'll prolly make my own so that if I lose teh InterTubes I have my own local stommepoes copy...

    I hate that clearfix, I hate the amount of code it takes... so, it just sits in the back of my mind for whenever the time may come that I am forced to use it... though so far I've avoided it, thanks to Gary's pointing the way for me to use display: table to enclose some floats while allowing overflow without ugly scrollbars...
     
    Stomme poes, Oct 14, 2008 IP