Question on rendering of replaced elements in tables

• From: Boris Zbarsky <bzbarsky@MIT.EDU>
• Date: Fri, 14 Jan 2005 05:59:22 -0600
• To: www-style@w3.org
• Message-ID: <41E7B41A.2060200@mit.edu>

Consider the following HTML:

<div style="display: table; width: 300px">
   <div style="display: table-row">
     <div style="display: table-cell">
       Lots of text, in several paragraphs, requiring a height of 400px
       to lay out if laid out at a width of 200px.
     </div>
     <img src="something" style="display: table-cell; width: 100px">
   </div>
</div>

Where "something" is an image with intrinsic width 200px and intrinsic height 200px.

What sort of box(es) does the <img> generate?  I'd assume, per spec, that it 
should generate a table-cell box, but it's not clear how those should behave for 
a replaced element.  For example, should the image end up being 100px wide by 
400px tall in this case?  If the table had border-collapse, should the image's 
borders collapse with the cell next to it?  And so forth.

In brief, how do the table layout algorithms interact with replaced elements, in 
general?

-Boris

Received on Friday, 14 January 2005 11:59:32 UTC