Bonjour !
Je suis en train de mettre à jour mon site personnel et j'essaye d'utiliser une feuille de style. Tout se passe bien, mais au moment de vouloir insérer deux listes différentes sur une même page, ça coinçe !

Une liste "horizontale" entre en conflit avec une liste "verticale"

Voilà le code de la feuille de css qui fâche:

ul{list-style-type:none;
text-decoration:none;
text-align:center;
}

li {display:inline;
margin: 20px;
font-size:15px;
}


Sans ce code mes listes se présentent comme une liste à puce standards, aussi celle du haut !

Avec ce code, j'obtiens bien comme je veux une liste agencée horizontalement, mais malheureusement la liste qui suit en dessous est aussi horizontale, ce que je ne veux pas...

ça fait tout l'après-midi que je me bagarre avec ça mais je ne trouve pas. J'ai l'impression que je pourrais utiliser une class, mais je ne vois pas trop comment !
Quelqu'un pourrait-il m'aider ?

UL espace accolade ?

Merci pour ta promte réaction.
J'ai donc remis l'espace accolade
Mais ça n'a pas apporté de solution ...

Tu as fait CTRL+F5 ? ^^

Si le site ou la page est en ligne poste l'url stp.

Je vais essayer de mettre en ligne ce qui est prêt et même la page que je n'arrive pas à régler... patience et merci

Voilà tout est en ligne
La page qui déconne c'est : CV (une liste horizontale, une liste verticale normale)

Merci !

Bon, en horizontal moi, je n'aime pas, mais question de goûts, et les UL ont text-align:center; alors ça fait bizarre, surtout que les points forts ne sont pas dans le même style (liste à puces), du coup ça fait une différence, une fois c'est centré, une fois non, etc. J'harmoniserais plutôt tout ça, pour un CV.

Avec ce code, j'obtiens bien comme je veux une liste agencée horizontalement, mais malheureusement la liste qui suit en dessous est aussi horizontale, ce que je ne veux pas...

Ok, j'ai pigé là en voyant. La liste en dessous doit être comment ?

Si tu fais ton code CSS pour UL et LI ça l'affecte à chaque UL et LI de toute la page. Tu n'es pas obligé d'utiliser UL et LI partout par contre.

Cher Falkra !

http://www.patricecharles.ch/CV.htm

Voici enfin un CV à peu près comme je le veux. J'ai finalement opté pour le présenter sous la forme d'un tableau car la gestion de deux listes avec des styles différents m'a parut plus ou moins impossible dans une seule feuille CSS. Mais je suis sur qu'avec une "class" quelque part ça devrait jouer.

Reste encore à régler: la largeur des colonnes ainsi que peut être la couleur de fond !

A part ça, pour l'instant, je pense garder ma navigation comme je l'ai présentée, horizontalement, en fait parce qu'elle est plutôt simple. Peut-être qu'une fois je changerai ça !

A+

Je trouve ça carrément plus pro(pre).

Pour les classes, tu peux affecter à une div précise des UL et LI différents, au lieu d'agir sur tous.

Ici tu agis sur tout :

Code: Tout sélectionner

ul{list-style-type:none;
text-decoration:none;
text-align:center;
}

li {display:inline;
margin: 20px;
font-size:15px;
}

Si tu fais par exemple :

Code: Tout sélectionner

div ul{list-style-type:none;
text-decoration:none;
text-align:center;
}

div li {display:inline;
margin: 20px;
font-size:15px;
}

Seules les balises LI et UL dans une DIV seront affectées.
Et ce n'est pas forcément une div, tu peux nommer ce que tu veux, par exemple au lieu de DIV tu mets "maliste".

Code: Tout sélectionner

maliste ul{list-style-type:none;
text-decoration:none;
text-align:center;
}

maliste li {display:inline;
margin: 20px;
font-size:15px;
}

et dans ton code HTML au lieu de <DIV></DIV> tu encadres ta liste avec

Code: Tout sélectionner

<div class="maliste">
<ul>
<li> point 1</li>
<li> point 2</li>
</ul>
</div>

Merci beaucoup !

Je garde tes codes sous le coude au cas où j'en aurai besoin plus tard. Pour l'instant je garde mon tableau !