Discussion :

[ciol007]

Bonjour,
Je n'arrive pas à aligner mon sommaire comme je le souhaite.
J'ai cherché sur internet un bon moment mais je ne trouve rien.
J'ai fait une liste imbriquée avec <ul>.

Visuellement je voudrais avoir ça :

Sommaire :
......Standards XHTML et CSS : quelle différence ?
..........Le W3C et les standards du Web
..........Séparer le fond de la forme avec HTML et CSS

J'obtiens ça avec mon code html et mon CSS

.........Sommaire :
.............Standards XHTML et CSS : quelle différence ?
..................Le W3C et les standards du Web
..................Séparer le fond de la forme avec HTML et CSS

Je souhaite aligner sur la gauche sans marge mais quand je mets padding-left:0px, c'est toute la liste qui est alignée à gauche et il n'y a plus de décalage lié aux puces.

Merci de votre aide

[rodolphebrd]

Bonjour,

pouvez-vous poster votre code HTML et CSS.

[laurentSc]

Comme le dit Rodolphebrd, ça serait plus facile avec du code, mais essaye quand-même de remplacer padding-left par margin-left

[ciol007]

Bonjour,
Je viens d'essayer avec margin left mais ça ne fonctionne pas.

Voici le code html :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<ul>
	<li>Sommaire</li>
	<ul>
		<li>Standards XHTML et CSS : quelle différence ?</li>
		<ul>
			<li> Le W3C et les standards du Web </li>
			<li>Séparer le fond de la forme avec HTML et CSS</li>
		</ul>
	</ul>
</ul>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
ul{list-style-type: none; padding-left: 0px;}
h3{font-weight: normal;}

[Torgar]

Pourquoi ne pas sortir le texte "Sommaire" de la liste tout simplement ?

[rodolphebrd]

N'hésitez pas à consulter les cours CSS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
ul:first-child{
   padding-left: 0px;
}

http://codepen.io/anon/pen/nEsow

[Bovino]

Ni les cours HTML... histoire de créer des listes imbriquées correctes !