Results 1 to 5 of 5

Thread: CSS float bug IE7

  1. #1
    Experienced user
    Join Date
    01-12-10.
    Posts
    814

    Default CSS float bug IE7

    I have some floating containers that are not displayed even though they do take in their exact amount of space (as if visibility: invisible). The target is to display the two address containers next to another. They do that in every browser except ie7 and ie6. They simply hide the contents!

    Does anyone recognize this particular floating bug? I've never seen this before.

    This shows the bug and relevant css.
    [attachment=2:2yyaeay1]bug-untreated.jpg[/attachment:2yyaeay1]

    This is if I remove the float (using the Isotope browser tags which are really helpful!!
    [attachment=1:2yyaeay1]bug-treated.jpg[/attachment:2yyaeay1]

    And this is what it is supposed to be and it is in all other browsers
    [attachment=0:2yyaeay1]bugfree.jpg[/attachment:2yyaeay1]

  2. #2

    Default Re: CSS float bug IE7

    Hi there, May be you have solved it already. I would change following and see if it works!

    1. floating needs a width property, So I would give some width to the floated spans. (only exception is Image which has intrinsic width value.)
    2. When you float something, display: block is redundant. floating makes all block level.
    OM MANI PEME HUNG! how many has to die for freedom and dignity. Save this world

  3. #3
    User
    Join Date
    07-20-09.
    Location
    Middlesbrough - United Kingdom
    Posts
    95

    Default Re: CSS float bug IE7

    When using the "float" element in IE I always couple it with "display:inline" this seems to iron out alot of the problems with IE based browers.

  4. #4
    New user
    Join Date
    08-08-11.
    Posts
    10

    Default Re: CSS float bug IE7

    Not sure if you solved this already or not. I think if you change the order of what you are floating in your code that will fix your issue. So for example if you want something to float right, say a div, have that div appear before whatever you are floating around. For some reason ie sees floats in a "special" way. Also check your widths and make sure your measurements are on target.

  5. #5
    Experienced user
    Join Date
    01-12-10.
    Posts
    814

    Default Re: CSS float bug IE7

    I finally got back to this bug, it is a known bug in IE. One of the containers of the floats was not floated thereby occupying no height (no reason why it should). In any case; you got too little information from me to solve my problem. But thanks for trying.

    Solution is to clear anything after the floats, or float the container. The last solution had no drawbacks in my case so that's the one I went with.

    rburch; Changing the order of the HTML goes against accessibility guidelines and should be avoided if the order of contents is important (in this case the order is in fact important; the second column refers to previous chosen options...). However, I know what you are talking about; sometimes floats float beneath other content. (I'm not sure if that is a bug. I should refresh my knowledge because I should/used to know this.

    matchboxhero; I have never seen that. I'll keep it in mind, perhaps it will save me another time

    tsarma; My disappearing floats had a width, but the implied block level mode I forgot/did not know. Thanks.

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
  •