Mettre une liste dans <div> ou <p>

Avatar du membre
Eléphanteau du PHP | 36 Messages

03 mars 2023, 11:04

Bonjour à tous,

Dans une page, mes paragraphe sont bien décalés par rapport au bord de page, mais il y a aussi une liste, qui n'est ni dans un paragraphe, ni dans une division.
Seulement, bien que dans le css, j'ai mis une classe .ecart (Xpx du bord de la page) et l'ai mis dans l'UL :
J'ai parlé plus haut de majeure partie des tests. Comme chacun sait ou le suppose, 
				il y a un grand nombre de formes de tests :<br>
				</p>

					<ul class="[b]ecart[/b] bleu liste">
						<li>Facteur Spatial</li>	
						<li>Facteur Perception</li>
						<li>Facteur Verbal</li>
						<li>Facteur Lexical</li>
						<li>Facteur Mémoire</li>
						<li>Facteur Numérique</li>
						<li>etc.</li>
					</ul>

				<p class="ecart">
				<strong>QI98</strong> ne peut pas prendre en compte toutes les possibilités de tests car cela serait beaucoup trop important; 
				donc, on va se contenter des catégories les plus utilisées, celles qui ont été citées plus haut.
http://qi98.free.fr/temp/decalage.jpg
Les paragraphes sont bien espacés du bord de la page, mais je n'y arrive pas avec une liste.

Two3d
m'avait dit que je ne pouvais pas mettre une liste dans un paragraphe, mais est-ce que je peux la mettre dans une division .

Merci de votre aide.

Diomos

Avatar du membre
Mammouth du PHP | 1609 Messages

03 mars 2023, 12:01

Comment as tu déclaré la css ? si tu as fait un p.ecart, forcément le style ne pourra pas s'appliquer au ul. En revanche si tu as bien mis juste .ecart, peut être as tu un style plus bas dans la css concernant les ul qui viendrait écraser le style déclaré dans .ecart. Mais c'est toujours pareil sans avoir tous les éléments (css, html) ni pouvoir regarder en live, dure de dire avec certitude ce qui ne va pas.
Développeur web depuis + de 20 ans

Avatar du membre
Eléphanteau du PHP | 36 Messages

03 mars 2023, 12:20

p.ecart{margin-left:50px;}
.ecart-liste {margin-left: 100px;}
J'ai essayé comme ça, mais ça ne va pas partout !

Par exemple, avec une lite "<ol>" ça fonctionne bien, par contre, avec "<ul>", rien ne va.

Alors, je me demande si le fait d'avoir remplacer des images à la place des tirets, ça ne jouerait pas ?
/* img flèche pour les <li></li> */
.liste{
	margin-left: 30px;
	list-style-image : url("../images/list/liste3.png");
	background-repeat : no-repeat;
}
J'ai pas essayé mais je vais tenter le coup !

Avatar du membre
Eléphanteau du PHP | 36 Messages

03 mars 2023, 12:26

OK, j'ai trouvé !
Caché dans un coin, il y avait un conflit dans le "margin-left".
Tout est résolu maintenant.

Merci d'avoir voulu m'aider.

Avatar du membre
Mammouth du PHP | 1609 Messages

03 mars 2023, 12:50

Ouep, déjà avec p.ecart la class ecart ne s'applique pas au ul, elle ne peut s'appliquer qu'au p et avec la class liste sur le ul, forcément le ul prend le margin left à 30px au lieu des 50px désirés.

A noter que l'ordre des class dans la déclaration des styles est important, le style le plus bas prendra l'ascendant sur le style plus haut sauf exception de "sélecteur". Faut pratiquer pour comprendre.
Développeur web depuis + de 20 ans