Pseudo-floating tables (again)

Hi,
This is not a new issue, i'm just looking to better understand why 
the current behavior is desirable. The previous WG reply was:
http://lists.w3.org/Archives/Public/www-style/2004Feb/0072.html
with a clarification at:
http://lists.w3.org/Archives/Public/www-style/2004Feb/0299.html

IMO the "may" bit on how elements that generate new block formatting 
contexts interact with floats in CSS 2.1 is unforturnate. It is also
possible that the chapter on calculating widths and margins need to
take this effect into account. I'm referring to the section:

http://www.w3.org/TR/CSS21/visuren.html#floats:
"The margin box of a table or an element in the normal flow that 
establishes a new block formatting context (such as an element with 
'overflow' other than 'visible') must not overlap any floats in the 
same block formatting context as the element itself. If necessary, 
implementations should clear the said element by placing it below 
any preceding floats, but may place it adjacent to such floats if 
there is sufficient space."

This gets (IMHO painfully) obvious when using legacy markup such as:

<table align="left">...</table>
<table align="center">...</table>
<table align="right">...</table>

While the rendering of the above case is reasonably consistent in
user agents, it is quite unlikely that an author would expect the
result, and the result seems inconsistent with the rules defined in:
http://www.w3.org/TR/CSS21/visuren.html#propdef-float
in how the right float does not end up "as high as possible".

I think that either the new block formatting context generating 
elements should be considered "full floats" or they should never be 
"pseudo-floats". That is, either all three tables should line up on 
one "line" if there is enough horizontal space in the example above,
or they should each have their own "line". Personally i think the 
second would be a much cleaner solution; that an author specifies 
'float' on something for it to act like a float, but floats are not 
allowed to span into new block formatting contexts and they are thus 
cleared before entering a new context.

To illustrate in ascii:

Current implementations:
------------------------------------------
First            Second 
------------------------------------------
                                    Third

I would prefer (and the rec allows):
------------------------------------------
First
------------------------------------------
                 Second 
------------------------------------------
                                    Third

But would also find the following better than current 
implementations:
------------------------------------------
First            Second             Third
------------------------------------------

Why is this discrepancy desirable? I can understand that there are 
probably quite a few pages depending on having tables pseudo-float, 
but would they break if tables became more fully floating or in 
some other way better integrated into the CSS model? I expect this
also has to do with how much a pseudo-floated table can 
"shrink-to-fit"? Some other problems in implementations are suggested
by the testcase below (like for instance that the chapter on 
calculating margins/widths does not seem to apply to theese 
"pseudo-floats"?). 

 /Staffan

<!DOCTYPE html 
     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
  <title>Floating tables and margin-auto table</title>
  <style type="text/css">
    .first {background-color: blue}
    .second {background-color: yellow}
    .third {background-color: green}
    .width40 {width: 40%}
  </style>
</head>
<body>
  <h1>Three aligned tables (left/center/right):</h1>
  <table class="first" align="left">
    <tr><td>First</td></tr>
  </table>
  <table class="second" align="center">
    <tr><td>Second</td></tr>
  </table>
  <table class="third" align="right">
    <tr><td>Third</td></tr>
  </table>
  <h1>Table align without centered second:</h1>
  <table class="first" align="left">
    <tr><td>First</td></tr>
  </table>
  <table class="second">
    <tr><td>Second</td></tr>
  </table>
  <table class="third" align="right">
    <tr><td>Third</td></tr>
  </table>
  <h1>'margin: auto' isen't calculated based on containing 
block?!?</h1>
  <table class="first width40" align="left">
    <tr><td>First</td></tr>
  </table>
  <table class="second width40" align="center">
    <tr><td>Second</td></tr>
  </table>
  <table class="third width40" align="right">
    <tr><td>Third</td></tr>
  </table>
  <h1>Wrapping to fit?</h1>
  <table class="first width40" align="left">
    <tr><td>First</td></tr>
  </table>
  <table class="second">
    <tr><td>Second has a lot of text (but no align="center" anymore) 
to see if this will casue the table to break the line, eg not use 
max-width or to see what happens when it cannot fit in max.</td></tr>
  </table>
  <table class="third width40" align="right">
    <tr><td>Third</td></tr>
  </table>
  <h1>Does it stop pseudo-floating when it does not fit?</h1>
  <div style="width: 200px; border: solid 1px black">
    <div class="first" style="float: left; width: 150px">Floated 
div</div>
    <table class="second">
      <tr><td>Pseudo_floated_table_without_line_breaks.</td></tr>
    </table>
  </div>
</body>
</html>

Received on Tuesday, 22 February 2005 17:37:09 UTC