CSS DIV: if block=inline and float=left, container collapses

The frustrating thing with coding with divs instead of tables is trying to get them to "act" like they're inside each other.

I have a container div, and three sub-divs.

First contains a plus sign
Second contains a Title
Third contains a price

When I declare the three inner divs to float:left (I want them next to each other) , the display of course automatically treated as inline, even if you explicitly declare it as block.

I've played the clear attribute and couldn't get it to work.

What happens in FF (my standard) is that the container just collapses if there's no "real" hard content in it such as plain text, images, or a div that doesn't have the float attribute.

I'm no CSS expert, but I find my way except when it comes to problems like this.

Any help is appreciate it. Trying to finish this tonight,


Dan

PS: Span tag instead of div? I'll try that. but I think span acts just like a div with display inline.

re: CSS DIV: if block=inline and float=left, container collapses

UPDATE:

I set the container's float and it fixed it in firefox.

it was previously display:block and clear:both, but since my content does not mess up if this is float, i'm fine with it.

re: CSS DIV: if block=inline and float=left, container collapses

Divs don't act like tables because they are not tables. A table is a fixed grid element. To get divs to act like that, set their sizes, such as width:100%.
Divs are always block elements and don't need to be declared as such. Floated elements are NOT treated as 'inline' (just to not confuse others) but CAN line up in a row.

This is correct behavior.

<span> works on inline elements, such as text or images in a <p>.