Ca passe avec du texte mais pas avec une image.

Bonjour,

Le html :

<div id="categories">
<ul >
<li>Dates et lieux des concours 1</li>
<li>Dates et lieux des concours 2</li>
<li>Dates et lieux des concours 3</li>
<li>Dates et lieux des concours 4</li>
<li>Dates et lieux des concours 5</li>
</ul>

<img src="miseenpage/bouton1.jpg"/>
</div>

CSS :

#categories {
height: 37px;
background-color: red;
width: 950px;
}

#categories ul {
float: right;
margin: 10px 0px 0px 190px;
height: 27px;
padding-left: 10px;
}

#categories li {
float: right;
display: block;
list-style-image: none;
list-style: none;
height: 27px ;
}

Codé ainsi, l'image ne vient pas combler l'espace à gauche de la liste pour apparaitre sur la même ligne horizontale.
Par contre si je mets du texte à la place de l'image, ça marche.

Je me tourne vers vous pour avoir the astuce!

Merci d'avance.

Bonjour,

Deux questions:
1. Il y a suffisamment d'espace libre à gauche de la liste pour que l'image s'y place?
2. Page en ligne?

salut,

si c'est un menu horizontal tu devrais supprimer

#categories li {
float: right;
display: block;
list-style-image: none;
list-style: none;
height: 27px ;
}

et remplacer par

#categories ul li {
display: inline;
list-style: none;
height: 27px ;
}

en espérant avoir répondu à ta demande.

++
Modifié par flattazor (15 Mar 2009 - 14:00)

@flattazor : ça ne fonctionne pas

Florent V. a écrit :
Bonjour,

Deux questions:
1. Il y a suffisamment d'espace libre à gauche de la liste pour que l'image s'y place?
2. Page en ligne?

J'avais pensé à l'espace et ce n'est pas là qu'est le problème.
Je mis le proto en ligne (c'est un Wordpress) :

http://www.formation-infirmier.fr/