Dans un paragraphe, toujours 1ère ligne en retrait

Avatar du membre
Eléphanteau du PHP | 36 Messages

15 févr. 2023, 17:29

Bonjour à tous,

Pourriez-vous m'aider pour empêcher le décalage de la 1ère ligne dans un paragraphe simple, dont voici un extrait de code.
<section>
		<div class="intitule grand"><span class="puce-page">&nbsp;&nbsp;&nbsp;</span>Test de QI</div>

	<article>
		<header>
			<div class="intitule bleu gras"><span class="puce-libelle">&nbsp;&nbsp;&nbsp;</span>&nbsp;&nbsp;&nbsp;</span>Testez votre QI directement en ligne.</span></div>
		</header>
			<br />
			<p>
				Avec ces différents tests de QI, vous pourrez ainsi définir dans quel environnement vous êtes le plus performant.
				<br />
				Comme je l'ai déjà signalé, cela pourra servir "<span class="gras bleufonce">d'entraînement</span>" pour l'utilisateur qui serait succeptible de passer des tests de QI dans un cabinet de recrutement par exemple, ou encore si un test doit être passé dans une entreprise avant une embauche.
				<br /><br />
				Je le rappelle encore, bien que certaines questions sont issues de tests officiels, il ne faut pas les prendre comme référence.
				<br /><br />
				Si, malgré les efforts de recherches, un test reste insoluble, <a title="" href="../contact2/contact.php"><span>contactez-moi</span></a> en m'expliquant avec quel test et quel numéro la solution est difficile à trouver.<br />
				Je vous répondrai personnellement par mail et vous enverrai le moyen de parvenir à la bonne solution en vous expliquant le moyen d'y parvenir !
				<br /><br />
					<ul class="liste">
						<li><a title="" href="tests/mot_etranger.php">Mot étranger</a></li>
						<li><a title="" href="tests/manque_chiffre-lettre.php">Manque chiffre ou lettre</a></li>
						<li><a title="" href="tests/suite_numerique.php">Suite numérique</a></li>
						<li><a title="" href="tests/suite_logique.php">Suite logique</a></li>
						<li><a title="" href="tests/nombre_etranger.php">Nombre étranger</a></li>
						<li><a title="" href="tests/dessin_etranger.php">Dessin étranger</a></li>
						<li><a title="" href="tests/tableau_juste.php">Tableau juste</a></li>
						<li><a title="" href="tests/sens_rotation.php">Sens de rotation</a></li>
						<li><a title="" href="tests/grand_test.php">Grand test de QI</a></li>
					</ul>
			</p>
	</article>
</section>
Merci de votre aide.

Diomos

Avatar du membre
Mammouth du PHP | 1596 Messages

15 févr. 2023, 18:12

Salut diomos (jlb59430 ?), de base la première ligne d'un paragraphe n'est pas sensée être décalée. Tu devrais vérifier les styles associés aux paragraphes qui posent problème.
Développeur web depuis + de 20 ans

Avatar du membre
Mammouth du PHP | 1489 Messages

16 févr. 2023, 02:29

Tes espaces peuvent être du aux &nbsp;&nbsp;&nbsp; (ce sont des espaces créés avec des entités HTML)

Concernant ton HTML, ya quelques erreurs :
Un <ul> à l'intérieur d'un <p> n'est pas correct
Tu as des </span> en trop dans ton <header>
<br /> doit être écrit sans / en HTML5 : <br>

Avatar du membre
Administrateur PHPfrance
Administrateur PHPfrance | 9663 Messages

16 févr. 2023, 08:49

A noter l'existence du validateur HTML du W3c qui permet d'aider à améliorer son code :
https://validator.w3.org/#validate_by_input
Quand tout le reste a échoué, lisez le mode d'emploi...

Avatar du membre
Eléphanteau du PHP | 36 Messages

16 févr. 2023, 19:32

Merci à tous de vos précieux conseils.

Et pour te répondre @rthur, je ne pense pas forcément à W3 et je doute que cela m'apporterait une réponse à mon problème !

Avatar du membre
Eléphanteau du PHP | 36 Messages

16 févr. 2023, 19:48

Tes espaces peuvent être du aux &nbsp;&nbsp;&nbsp; (ce sont des espaces créés avec des entités HTML)

Concernant ton HTML, ya quelques erreurs :
Un <ul> à l'intérieur d'un <p> n'est pas correct
Tu as des </span> en trop dans ton <header>
<br /> doit être écrit sans / en HTML5 : <br>
Les espaces &nbsp! sont contenus entre <div> et </div>, donc, logiquement, ça n'a rien à voir avec le paragraphe après !
Dans le <DIV> du HEADER, il y avait une balise fermante </span> en trop, j'ai corrigé mais le problème existe toujours.

Je ne savais pas que <UL></UL> ne pouvait pas être dans un paragraphe !

Pour <br />, je l'avais fait depuis 1997, et je ne pense pas trop à corriger ça car c'est pas un empêchement pour le bon fonctionnement de la ou les pages.
Mais je vais faire attention au fur et à mesure du temps !

Avatar du membre
Eléphanteau du PHP | 36 Messages

16 févr. 2023, 19:52

Salut diomos (jlb59430 ?), de base la première ligne d'un paragraphe n'est pas sensée être décalée. Tu devrais vérifier les styles associés aux paragraphes qui posent problème.
Et oui, je me suis rebaptisé "diomos", car j'ai le même pseudo dans plusieurs forums.

En se qui concerne le style pour le paragraphe, j'ai rien vu !
Je suis peut-être passé à côté ! Je vais encore regarder.

Avatar du membre
Mammouth du PHP | 1596 Messages

17 févr. 2023, 12:22

Au pire file le lien de la page et on va vite voir.
Développeur web depuis + de 20 ans

Avatar du membre
Eléphanteau du PHP | 36 Messages

17 févr. 2023, 13:03

Au pire file le lien de la page et on va vite voir.
Ce ne sera pas possible parce que je travaille en local !
C'est évident qu'il aurait sûrement d'autres possibilités, mais dans l'immédiat, je n'en vois pas !

Avatar du membre
Mammouth du PHP | 1596 Messages

17 févr. 2023, 13:12

As-tu testé les outils de développement du navigateur ? parce qu'en inspectant les paragraphes et ce qui gravite autour, tu devrais voir les marges internes et externes des éléments, et ça pourrait grandement t'aider à comprendre d'où vient ce décalage. C'est un outil indispensable quand on fait du développement web.
Développeur web depuis + de 20 ans

Avatar du membre
Eléphanteau du PHP | 36 Messages

23 févr. 2023, 10:47

As-tu testé les outils de développement du navigateur ? parce qu'en inspectant les paragraphes et ce qui gravite autour, tu devrais voir les marges internes et externes des éléments, et ça pourrait grandement t'aider à comprendre d'où vient ce décalage. C'est un outil indispensable quand on fait du développement web.
Bonjour,
Désolé du retard :cry: , mais avec le nouveau site et la mise en pratique de ce que vous m'avez appris, two3d et toi, je zappe le forum parce que parfois, j'ai des erreurs et je regarde pourquoi et comment y remédier.

Pour en revenir à ce que tu m'as écrit, je n'ai pas trop bien compris que tu parles des "outils de développement du navigateur" ! :?

C'est quoi exactement ?

Avatar du membre
Mammouth du PHP | 1489 Messages

23 févr. 2023, 11:00


Avatar du membre
Eléphanteau du PHP | 36 Messages

23 févr. 2023, 18:59

Merci, j'ai vu ! C'est plutôt cool !

Avatar du membre
Mammouth du PHP | 1489 Messages

23 févr. 2023, 20:07

Oui, c'est super pratique !

Avatar du membre
Eléphanteau du PHP | 36 Messages

26 févr. 2023, 12:57

Bonjour,

J'ai trouvé pour le retrait de la ligne c'est
text-indent:xxpx;
.
J'avais recherché partout et je ne voyais rien.
C'était simplement dans le style pour le html.
Au départ, je pensais que ça indentait tous le textes dans les <p> et <div>, mais ça n'affectait que la 1ère ligne.