SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Guru Luki_be's Avatar
    Join Date
    Jun 2008
    Location
    Brazil, Minas Gerais. But i'm from Belgium.
    Posts
    867
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Float prob - IE6 - sigh

    And I thought I had come along way past this basic question. :-(

    page

    Css

    IE6 doesn't wrap the text around the floated image. Instead it drops the non floated #block2 .

    Come on guys and girls, make me blush with shame
    SitePoint Guru
    Sitepoint - the ultimate Css well
    As a computer, I find your faith in technology amusing.
    Sitepoint reference, your friend in need

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,471
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    The width of the float and the width of the content (of which both have been set) are not enough to fit horizontally across the space so IE6 drops the text below.

    Other browsers let the background slide under the float and repel the foreground content but IE when in haslayout mode moves the whole element below. This would be the same effect you would get in other browsers if you applied overflow other than visible to #block2.

    To achieve the effect you want you should move the floated element inside block2 and then change it's right margin to a negative amount to pull it wide where you want it. You will probably also need to add position:relative as IE will hide the overflow portion.

  3. #3
    SitePoint Guru Luki_be's Avatar
    Join Date
    Jun 2008
    Location
    Brazil, Minas Gerais. But i'm from Belgium.
    Posts
    867
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B View Post
    Hi,

    The width of the float and the width of the content (of which both have been set) are not enough to fit horizontally across the space so IE6 drops the text below.

    Other browsers let the background slide under the float and repel the foreground content but IE when in haslayout mode moves the whole element below. This would be the same effect you would get in other browsers if you applied overflow other than visible to #block2.

    To achieve the effect you want you should move the floated element inside block2 and then change it's right margin to a negative amount to pull it wide where you want it. You will probably also need to add position:relative as IE will hide the overflow portion.
    I knew it was the dreaded width problem lol but the fact that IE doesn't let the background slide under the float (since they are removed from the flow) slipped my old and rusty brain (approaching the 50 threshold is not advisable
    lol).

    Tnx for the reminder Paul ... i'll correct the issue in a bit.

    And as i promised:
    SitePoint Guru
    Sitepoint - the ultimate Css well
    As a computer, I find your faith in technology amusing.
    Sitepoint reference, your friend in need


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
  •