On 27 Jan 2006, at 7:36 am, Adam Kuehn wrote:
>> from what i understand, one newbie to another, is that you can
>> *either* float or display, but both don't happen at the same time
>> (unless you consult with IE). if you float, it means that "display"
>> is effectively ignored by standards-comliant browsers.
>>
>
> Well, almost. When an element is floated, its "display" value is
> automatically set to "block". That's almost the same thing, but
> not quite.
Not quite, in the case of a <li>. The default display property for
the li is {display:list-item}, which is a block level element with a
special twist: it automatically adds a list-marker in front of the
block. When floating the li, it remains 'display:list-item', and
keeps the list-marker [*]. You'd have to set the <li> explicitly to
'display:block'. See test file linked below [1].
[*] iCab 3.0, IE Mac, Webkit (Safari, Omniweb), Gecko (Firefox).
Imho, Opera is wrong by omitting the list-marker in the first test case.
<http://www.w3.org/TR/CSS21/visuren.html#dis-pos-flo>
> Again, not quite. In modern browsers that follow the CSS2.1 spec,
> the float gets the width of the content (sometimes referred to as
> "shrink-wrapping") up to 100% of the available space, at which point
> the content will wrap. The exception is IE5/Mac which slavishly
> follows the 2.0 spec and will default to 100% width. If you need to
> support IE5/Mac, you will need to supply a declared width. (Em-based
> widths often work well for this purpose.) The height is defined as
> the height of the content, subject to the wrapping rule I mentioned.
You can trick IE Mac in 'shrinkwrapping' the floated li:
* html>body li {width:1px; white-space:nowrap;}
[1] <http://dev.l-c-n.com/_temp/li-float.php>
Philippe
---
Philippe Wittenbergh
<http://emps.l-c-n.com/>
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
