IE 7 bug: declared width for table cell wrongly affects inner block

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • Jukka K. Korpela

    IE 7 bug: declared width for table cell wrongly affects inner block

    Sub titulo "Re: DIV borders different in IE7 when in td"
    scripsit Ben C:
    Table cells should never go narrower than the minimum width required
    by their contents. Normal flow block boxes (like default DIV) get the
    width you set, overflowing if necessary.
    This seems to be the heart of the matter, and I'm trying to get a real
    discussion started, by moving the discussion to the right group
    (c.i.w.a.styles heets) and changing the Subject line.

    It seems to me that IE 7, specifically in "standards mode" (!),
    misbehaves when a table cell has a declared width but the actual width
    is larger, due to the requirements of its content. When the <tdelement
    contains a <divelement, IE 7 expands the <tdbut not the <divinside
    it. This can be seen from the background or border of the <div>, if set,
    and even the formatting of its textual content.

    However, width calculation is mystic area in CSS, so it might be
    possible that under some weird interpretation, IE 7 is "right", though I
    cannot see how.

    Demo: http://www.cs.tut.fi/~jkorpela/www/width-bug.html

    --
    Jukka K. Korpela ("Yucca")


  • Ben C

    #2
    Re: IE 7 bug: declared width for table cell wrongly affects inner block

    On 2008-05-01, Jukka K. Korpela <jkorpela@cs.tu t.fiwrote:
    Sub titulo "Re: DIV borders different in IE7 when in td"
    scripsit Ben C:
    >
    >Table cells should never go narrower than the minimum width required
    >by their contents. Normal flow block boxes (like default DIV) get the
    >width you set, overflowing if necessary.
    >
    This seems to be the heart of the matter, and I'm trying to get a real
    discussion started, by moving the discussion to the right group
    (c.i.w.a.styles heets) and changing the Subject line.
    >
    It seems to me that IE 7, specifically in "standards mode" (!),
    misbehaves when a table cell has a declared width but the actual width
    is larger, due to the requirements of its content. When the <tdelement
    contains a <divelement, IE 7 expands the <tdbut not the <divinside
    it. This can be seen from the background or border of the <div>, if set,
    and even the formatting of its textual content.
    >
    However, width calculation is mystic area in CSS, so it might be
    possible that under some weird interpretation, IE 7 is "right", though I
    cannot see how.
    >
    Demo: http://www.cs.tut.fi/~jkorpela/www/width-bug.html
    CSS 2.1 10.3.3 is very clear that the div's used width should in this
    case (since all horizontal properties are auto) be equal to the width of
    its containing block.

    The containing block is formed by the content edge of the table cell.

    So what is its width?

    The computed value of the table-cell's width is "100px". But the used
    value of its width is the width required by the long word (it depends on
    your font, about 280px in my browser).

    My hypothesis for the cause of the bug here is that when IE7 comes to
    implement the rules in 10.3.3 for the div, it looks up the computed
    width on the td and so gets 100px as the containing block width. It
    should instead be looking up the used width [1].

    It then solves the equation in 10.3.3 for 100px giving the div a used
    negative right margin of about -180px.

    So where does the spec say that "width of the containing block" in
    10.3.3 means used width and not computed width"?

    Well 10.1 says:

    2. [..] the containing block is formed by the content edge of the
    nearest block-level [p. 117], table cell or inline-block ancestor
    box.

    "Content edge" is defined in 8.1, as the rectangle given by the "width"
    and "height" of the box.

    A bit later in 8.1 it says:

    The dimensions of the content area of a box — the content width and
    content height — depend on several factors: whether the element
    generating the box has the 'width' or 'height' property set, whether
    the box contains text or other boxes, whether the box is a table, etc.
    Box widths and heights are discussed in the chapter on visual
    formatting model details [p. 157] .

    Clearly this is the used width and height they're talking about, not the
    computed width and height.

    [1] You possibly get this only in strict mode because it has got conflated
    internally within IE with the need not to honour percentages of auto
    height table cells in strict mode. In quirks mode browsers will allow
    percentage heights of auto height cells for which they have to use
    "used" values. In strict they should ignore such percentages.

    Comment

    • Patricia Aldoraz

      #3
      Re: IE 7 bug: declared width for table cell wrongly affects innerblock

      On May 1, 9:40 pm, "Jukka K. Korpela" <jkorp...@cs.tu t.fiwrote:
      IE 7 formats the box content and observes the long word, which is too
      long for that width. It expands the cell to accommodate the long box.
      However, once the box has tricked the cell into expanding, it
      contracts suddenly, leaving the cell expanded and does a little
      contracting trick of its own. Only IE has a sufficiently jokey nature
      to pull this one off. It is a real card!

      Comment

      Working...