|
|
Posted by Ben C on 11/02/06 22:13
On 2006-11-02, Doug <dmly.usa@gmail.com> wrote:
> Hi all,
> I would like to display the list horizontally. I've learned that the li
> style need to be inline.
> I have the code as follow but it doesn't work.
> Thank you for helping
Make li float: left and display: block.
You can also make it float: left and display: inline, the effect is the
same. But I think display: block makes more sense. Or just leave it as
the default (display: list-item) and set list-style-type to none.
The reason why what you have isn't working is that your <li>s contain
block level elements. Apart from inline-blocks (which are another
story), inline boxes can't really contain block boxes.
I'm talking about boxes here, in the sense of the CSS box model, not to
be confused with inline vs block _elements_, concerning which the HTML
DTD defines validity requirements. It is perfectly valid CSS to have
display: block elements inside display: inline elements, but the
specification defines that anonymous block boxes are created effectively
in order to keep the inline boxes as leaves in the tree of boxes. You
can read about anonymous block boxes in section 9.2.1.1 of CSS 2.1.
Navigation:
[Reply to this message]
|