Je fais un tp en classe et j'ai un petit problème, tout me semble bon sauf que dans la partie section, j'ai mis des balises article dedans, cependant, les deux premiers articles sont décalés. Et pourtant quand on voit les troisièmes et quatrièmes articles, et bien ils sont tous bien alignés !
Si quelqu'un de généreux peut m'aider svp :))))
voici un screen pour vous montrer le problème :
Le code html :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="style.css" />
<title>Mon Pantheon</title>
</head>
<body>
<!-- header */ -->
<header>
<h1>
Mon pantheon
</h1>
</header>
<br/>
<!-- nav -->
<nav>
<ul>
<li><a href="info.html">Informaticiens</a></li>
<li><a href="math.html">Mathematiciens</a></li>
<li><a href="sport.html">Sportifs</a></li>
<li><a href="music.html">Musiciens</a></li>
</ul>
</nav>
<br/>
<br/>
<!-- content -->
<div class="content">
<!-- sidebar -->
<aside>
<p>
Dennis MacAlistair Ritchie, né le 9 septembre 1941 à Bronxville dans l'État de New York et trouvé mort le 12 octobre 20111 à Berkeley Heights dans le New Jersey, est un des pionniers de l'informatique moderne, inventeur du langage C et codéveloppeur de Unix. Il est parfois désigné par dmr, son adresse électronique aux Laboratoires Bell.
</p>
<p>
Linus Benedict Torvalds, né le 28 décembre 1969 à Helsinki en Finlande, est un informaticien américano-finlandais1. Il est connu pour avoir créé en 1991 le noyau Linux dont il continue de diriger le développement. Il en est considéré comme le « dictateur bienveillant ».
</p>
<p>
Blaise Pascal, né le 19 juin 1623 à Clairmont (aujourd'hui Clermont-Ferrand), en Auvergne, mort le 19 août 1662 à Paris, est un mathématicien, physicien, inventeur, philosophe, moraliste et théologien français.
Enfant précoce, son père l'éduque. Les premiers travaux de Pascal concernent les sciences naturelles et appliquées. Il contribue de manière importante à l’étude des fluides. Il a clarifié les concepts de pression et de vide, en étendant le travail de Torricelli. Pascal a écrit des textes importants sur la méthode scientifique.
</p>
<p>
Alan Mathison Turing, né le 23 juin 1912 à Londres et mort le 7 juin 1954 à Wilmslow, est un mathématicien et cryptologue britannique, auteur de travaux qui fondent scientifiquement l'informatique.
Pour résoudre le problème fondamental de la décidabilité en arithmétique, il présente en 1936 une expérience de pensée que l'on nommera ensuite machine de Turing et des concepts de programmation et de programme, qui prendront tout leur sens avec la diffusion des ordinateurs, dans la seconde moitié du xxe siècle.
</p>
</aside>
<section>
<!-- article -->
<article id="dennis">
<p> <img src="/img/dennisritchie.jpg" alt="dennis" />
<h2>
Dennis Ritchie
</h2>
9 Septembre 1941 - 8 Octobre 2011
<br/><br/>
Nationalité : americaine
</p>
</article>
<article id="linus" >
<p> <img src="/img/Linus_Torvalds.jpeg" alt="linus" />
<h2>
Linus Torvalds
</h2>
28 decembre 1969 -
<br/><br/>
Nationalité : finlandaise
</p>
</article>
<article id="blaise">
<p> <img src="/img/Blaise_pascal.jpg" alt="blaise" />
<h2>
Blaise Pascal
</h2>
19 June 1623 – 19 Aout 1662
<br/><br/>
Nationalité : francaise
</p>
</article>
<article id="turing">
<p> <img src="/img/Alan_Turing.jpg" alt="turing" />
<h2>
Alan Turing
</h2>
23 Juin 1912 – 7 Juin 1954
<br/><br/>
Nationalité : britannique
</p>
</article>
</section>
</div>
<br/>
<br/>
<!-- footer -->
<footer>
<a href="mailto:adresse@email.com" style="text-align: left;">M'envoyer un mail</a>
<a href="/index.html" style="float:right;">Revenir à la page d'accueil</a>
</footer>
</body>
</html>
Plutôt que d'utiliser des display: inline-block ou float: left. Je te conseille d'utiliser cette méthode display:flex; qui te permet de mettre tes éléments où tu le veux.
Il faut corriger ton html aussi. <br> ne sert qu'à revenir à la ligne au sein d'un bloc de texte, pas à sauter des lignes. Si tu dois changer de paragraphe, ferme et ouvre une balise paragraphe. Si tu essaies de faire des marges, utilise du CSS.
En parlant de balise paragraphe (<p>), elle n'est pas sensé contenir de titres. Et tu n'es pas obligé d'en employer une chaque fois que tu affiches du texte ou une image.
- Edité par EmmanuelBeziat 3 décembre 2016 à 11:34:56
Il n'y a pas de mauvais navigateur, il n'y a que du mauvais code !
alignement d'article décalé
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
Il n'y a pas de mauvais navigateur, il n'y a que du mauvais code !