[CSS] img+txt in horizontale list

[X-Lars]

HTML:

<ul>
  <li>[img]"images/ex1.jpg"[/img]<span>ex. 1</span></li>
  <li>[img]"images/ex2.jpg"[/img]<span>ex. 2</span></li>
  <li>[img]"images/ex3.jpg"[/img]<span>ex. 3</span></li>
</ul>

Cascading Stylesheet:

li {
    display:inline;
    list-style-type:none;
    height:130px;
    width:100px;
    margin-left:10px;
    }   

code:

---------  ---------  ---------
|       |  |       |  |       |
|  img  |  |  img  |  |  img  |
|       |  |       |  |       |
---------  ---------  ---------
|  txt  |  |  txt  |  |  txt  |
---------  ---------  ---------

Wat is de manier om dit te doen? Zodat de image en de text eronder gecentreerd zijn, maar vooral dat de tekst onder de image valt. Ik kan het (of een voorbeeld) nergens vinden.

[ Voor 34% gewijzigd door X-Lars op 02-11-2004 14:57 ]

[crisp]

ik zou de li een float:left geven, en de img en span daarin een display:block; je kan dan voor de text gewoon text-align:center gebruiken

[X-Lars]

Crap, de display:inline; moest niet in de li {} staan. But you're damn right, crisp

Edit: de span om de text kan weggelaten worden (wel evt. de li een text-align:center; meegeven).

[ Voor 38% gewijzigd door X-Lars op 02-11-2004 15:19 ]