RE: Floats need explicit width??

Hmmm. I didn't find the reference that said floats didn't need an explicit
width anymore, but then I don't see any explicit reference saying they need
a width either.

 

What I do know is that if you leave it off, some browsers consider the width
to be 100% and your element won't float. I suspect an explicit width is
required on all non-replaced elements and the intrinsic width is used on all
replaced elements (e.g. the list shown in the warning) if one isn't
specified. I had a problem trying to float list items for a horizontal menu.
Until I added the width property it didn't work as expected. That caused a
different issue as I wanted the width to be automatic. I don't recall how I
resolved the issue.

 

What I found more curious were the W-3's examples using span tags. I had
some formatting applied to links to make them look like buttons. Worked
great in IE, but not Firefox. Eventually I discovered that width is not a
property of non-replaced inline elements, of which the span element is one.
Changing those to div elements fixed the problem for me. So why do we see
the W3C using span with widths?

 

In the examples in http://www.w3.org/TR/CSS21/visuren.html#floats the span
elements are floated left and provided a width and height. This actually
works and I was surprised that it would. However, further reading shows that
9.4.1 states: 

"Floats, absolutely positioned elements, inline-blocks, table-cells,
table-captions, and elements with 'overflow' other than 'visible' (except
when that value has been propagated to the viewport) establish new block
formatting contexts."

 

So, I guess that answers my question. You can have a width on a span element
if it is floated. For your question, I believe the warning is a valid one.
Leaving off the width may yield unexpected results in different browsers.

 

--Doug

 

 

 

Received on Friday, 13 February 2009 16:27:36 UTC