Problem with converting to divisions

Discussion in 'HTML' started by Richard, Jan 10, 2004.

  1. Richard

    Richard Guest

    http://1-large-world.com/stargate/movie/tooltip3.html#

    IN IE 6 and Opera 7, things look like I want them.
    In Mozilla, the white and black bordered divisions are nowhere near where
    they're supposed to be.
    It's like 'float' doesn't even exist.
    Ok so I kind of cleared that up by making both the red and white bordered
    divisions the same height.
    The four images are supposed to be within the black division, not underneath
    it.
    Why is this?
    If mozilla is correct, then opera 7 isn't by any means.
    Richard, Jan 10, 2004
    #1
    1. Advertising

  2. Richard

    Steve Pugh Guest

    "Richard" <anonymous@127.000> wrote:

    >http://1-large-world.com/stargate/movie/tooltip3.html#
    >
    >IN IE 6 and Opera 7, things look like I want them.
    >In Mozilla, the white and black bordered divisions are nowhere near where
    >they're supposed to be.
    >It's like 'float' doesn't even exist.
    >Ok so I kind of cleared that up by making both the red and white bordered
    >divisions the same height.
    >The four images are supposed to be within the black division, not underneath
    >it.
    >Why is this?
    >If mozilla is correct, then opera 7 isn't by any means.


    When an element is floated it is removed from the document flow. This
    means, amongst other things, that it does not contribute towards the
    height of its parent. On this basis Mozilla is correct. Opera 5 and 6
    are also correct.

    It seems to be the width on the parent element (i.e. the div.boxtitle
    { width:90%; }) that makes both O7 and IE6 include the floated images
    in the height calculation for that element. Remove the width and both
    IE6 and O7 behave like Mozilla.

    I have no idea why specifying a width should change how the height is
    calculated. This may be a bug in IE and O7 or it may be some subtle
    feature of CSS that I'm unaware of, and thus a bug in Mozilla.

    Steve

    --
    "My theories appal you, my heresies outrage you,
    I never answer letters and you don't like my tie." - The Doctor

    Steve Pugh <> <http://steve.pugh.net/>
    Steve Pugh, Jan 10, 2004
    #2
    1. Advertising

  3. Richard

    Richard Guest

    Steve Pugh wrote:

    > "Richard" <anonymous@127.000> wrote:


    >>http://1-large-world.com/stargate/movie/tooltip3.html#
    >>
    >>IN IE 6 and Opera 7, things look like I want them.
    >>In Mozilla, the white and black bordered divisions are nowhere near where
    >>they're supposed to be.
    >>It's like 'float' doesn't even exist.
    >>Ok so I kind of cleared that up by making both the red and white bordered
    >>divisions the same height.
    >>The four images are supposed to be within the black division, not
    >>underneath it. Why is this? If mozilla is correct, then opera 7 isn't by

    > any means.


    > When an element is floated it is removed from the document flow. This
    > means, amongst other things, that it does not contribute towards the
    > height of its parent. On this basis Mozilla is correct. Opera 5 and 6
    > are also correct.


    > It seems to be the width on the parent element (i.e. the div.boxtitle
    > { width:90%; }) that makes both O7 and IE6 include the floated images
    > in the height calculation for that element. Remove the width and both
    > IE6 and O7 behave like Mozilla.


    > I have no idea why specifying a width should change how the height is
    > calculated. This may be a bug in IE and O7 or it may be some subtle
    > feature of CSS that I'm unaware of, and thus a bug in Mozilla.


    > Steve


    That's what I was wondering.
    But then if I can't control the width with nested divisions, what's the
    point of nested divisions?

    How do I then go about centering the division (boxtitle) in the page?
    <center> doesn't work with divisions as it does with tables.
    Richard, Jan 10, 2004
    #3
  4. Richard

    Richard Guest

    Steve Pugh wrote:

    > "Richard" <anonymous@127.000> wrote:


    >>http://1-large-world.com/stargate/movie/tooltip3.html#
    >>
    >>IN IE 6 and Opera 7, things look like I want them.
    >>In Mozilla, the white and black bordered divisions are nowhere near where
    >>they're supposed to be.
    >>It's like 'float' doesn't even exist.
    >>Ok so I kind of cleared that up by making both the red and white bordered
    >>divisions the same height.
    >>The four images are supposed to be within the black division, not
    >>underneath it. Why is this? If mozilla is correct, then opera 7 isn't by

    > any means.


    > When an element is floated it is removed from the document flow. This
    > means, amongst other things, that it does not contribute towards the
    > height of its parent. On this basis Mozilla is correct. Opera 5 and 6
    > are also correct.


    > It seems to be the width on the parent element (i.e. the div.boxtitle
    > { width:90%; }) that makes both O7 and IE6 include the floated images
    > in the height calculation for that element. Remove the width and both
    > IE6 and O7 behave like Mozilla.


    > I have no idea why specifying a width should change how the height is
    > calculated. This may be a bug in IE and O7 or it may be some subtle
    > feature of CSS that I'm unaware of, and thus a bug in Mozilla.


    Ah hah. If I define a height, the problem in mozilla goes away.
    Richard, Jan 10, 2004
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. time waster
    Replies:
    5
    Views:
    782
    informant
    Nov 17, 2003
  2. Dennis M. Marks

    Positioning Divisions with CSS

    Dennis M. Marks, Dec 10, 2003, in forum: HTML
    Replies:
    1
    Views:
    563
    Terry Joyce
    Dec 10, 2003
  3. Richard
    Replies:
    5
    Views:
    474
    rblah
    Jan 17, 2004
  4. Richard
    Replies:
    1
    Views:
    369
  5. Dennis Marks

    Overlapping Divisions with CSS

    Dennis Marks, May 12, 2004, in forum: HTML
    Replies:
    4
    Views:
    2,540
    Mitja
    May 13, 2004
Loading...

Share This Page