Bonjour , je suis actuellement a l’exercice pratique avec la mise en page , seulement j'ai beau retourner mon CSS dans tous les sens je ne vois pas le problème ....
VOici l'énoncé : Affichez les paragraphes en justifié, sur 80% de largeur et centrez leurs blocs sur la page
Si certains peuvent me donner des conseils/m'expliquer ou je me suis planté ca sera avec plaisir !
Le sujet est déplacé de la section Let's talk! vers la section HTML / CSS
Manque de recherche
La question que vous posez est très fréquente, cela démontre un manque de recherche évident. Internet et ce forum fourmillent de ressources répondant à votre besoin.
Je vous invite à effectuer de vraies recherches qui sont à la base d'un bon apprentissage…
Pas d'aide concernant le code par MP, le forum est là pour ça :)
Le sujet est déplacé de la section Let's talk! vers la section HTML / CSS
Manque de recherche
La question que vous posez est très fréquente, cela démontre un manque de recherche évident. Internet et ce forum fourmillent de ressources répondant à votre besoin.
Je vous invite à effectuer de vraies recherches qui sont à la base d'un bon apprentissage…
Et bien si justement j'ai bien fais mes recherches et j'ai bien essayé ce que les autres on dit sans succes !
Frogweb a écrit:
Salut,
quel le problème exactement ? que n'arrives-tu pas à faire ? J'ai testé ton code avec beaucoup de texte dans les <p> et le texte est bien justifié.
En passant, justifié du texte sur le web est une mauvaise chose pour l'accessibilité.
- Edité par Frogweb 28 septembre 2018 à 15:25:56
Justement je cherche le soucis , l'exercice me dit que c'est faux alors que j'ai demandé a certaines personnes qui sont dans le milieu et ils n'arrivent pas a me dire ou je me suis planté .
Je cherche a comprendre ce que je fais de mal pour que l'exercice soit une reussite
Tu va recommencer l’exercice en faisant en 1er le problème du paragraphe, ce que tu à collé dans ton CSS pour p{} est bon
- Edité par exen 30 septembre 2018 à 20:03:02
non sait pas un bug . "tout es possible tout es realissable!!! "enfin moi je suis arrive a valide les 4 block en vert dans le bon sans . même 2 fois avec deux code legerment differrent .mais bon je suis que un eleve padawan qui es a se niveau la du cours . mais comme solution finale je vous proposse
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="style.css" />
<title>Le blog trotter</title>
</head>
<body>
<div id="topsection">
<header>
<h1>Le blog trotter</h1>
<p>Je parcours la planète... et vous la fais découvrir !</p>
</header>
<nav> <ul id="menu">
<a href="#">Accueil</a>
<a href="#">Archives</a>
<a href="#">Contact</a>
</ul></nav>
</div>
<h1>La Chine</h1>
<p>Bla bla bla bla Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla hendrerit mauris a ornare. Nam finibus ante id lacinia placerat. Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec metus mauris, imperdiet eget tincidunt rhoncus, venenatis id risus. Proin at est eu nibh faucibus faucibus non in magna. Ut iaculis quam nisi, eu efficitur justo eleifend lobortis. Etiam purus metus, feugiat non enim et, egestas volutpat lacus. Aenean id justo arcu. Interdum et malesuada fames ac ante ipsum primis in faucibus.</p>
<p>Phasellus dictum aliquam euismod. Donec orci augue, efficitur non nunc vel, tincidunt mattis nibh. Suspendisse ac ligula non mauris semper fermentum ut eget dui. Aliquam erat volutpat. Curabitur vulputate, nulla quis rhoncus volutpat, eros risus hendrerit massa, at suscipit tortor magna at diam. Phasellus tincidunt massa libero, id bibendum dui dapibus sed. Etiam nec risus eget nisl posuere ultrices. Ut sodales ante eget leo luctus molestie. Aenean vel urna in turpis rhoncus scelerisque. Etiam in nisi sapien.</p>
<h1>L'Espagne</h1>
<p>Bla bla bla bla Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla hendrerit mauris a ornare. Nam finibus ante id lacinia placerat. Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec metus mauris, imperdiet eget tincidunt rhoncus, venenatis id risus. Proin at est eu nibh faucibus faucibus non in magna. Ut iaculis quam nisi, eu efficitur justo eleifend lobortis. Etiam purus metus, feugiat non enim et, egestas volutpat lacus. Aenean id justo arcu. Interdum et malesuada fames ac ante ipsum primis in faucibus.</p>
<p>Phasellus dictum aliquam euismod. Donec orci augue, efficitur non nunc vel, tincidunt mattis nibh. Suspendisse ac ligula non mauris semper fermentum ut eget dui. Aliquam erat volutpat. Curabitur vulputate, nulla quis rhoncus volutpat, eros risus hendrerit massa, at suscipit tortor magna at diam. Phasellus tincidunt massa libero, id bibendum dui dapibus sed. Etiam nec risus eget nisl posuere ultrices. Ut sodales ante eget leo luctus molestie. Aenean vel urna in turpis rhoncus scelerisque. Etiam in nisi sapien.</p>
<footer>
<p>Copyright Le Blog Trotter</p>
</footer>
</body>
</html>
et
/* Feuille de style */
#topsection
{
display:flex;
}
p
{
text-align:justify;
width:80%;
margin:auto;
}
et il y a une petit variante en rajoute que "nav" dans le html sans touche au "li" me semble t'il
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="style.css" />
<title>Le blog trotter</title>
</head>
<body>
<div id="topsection">
<header>
<h1>Le blog trotter</h1>
<p>Je parcours la planète... et vous la fais découvrir !</p>
</header>
<nav> <ul id="menu">
<li><a href="#">Accueil</a></li>
<li><a href="#">Archives</a></li>
<li><a href="#">Contact</a></li>
</ul></nav>
</div>
<h1>La Chine</h1>
<p>Bla bla bla bla Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla hendrerit mauris a ornare. Nam finibus ante id lacinia placerat. Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec metus mauris, imperdiet eget tincidunt rhoncus, venenatis id risus. Proin at est eu nibh faucibus faucibus non in magna. Ut iaculis quam nisi, eu efficitur justo eleifend lobortis. Etiam purus metus, feugiat non enim et, egestas volutpat lacus. Aenean id justo arcu. Interdum et malesuada fames ac ante ipsum primis in faucibus.</p>
<p>Phasellus dictum aliquam euismod. Donec orci augue, efficitur non nunc vel, tincidunt mattis nibh. Suspendisse ac ligula non mauris semper fermentum ut eget dui. Aliquam erat volutpat. Curabitur vulputate, nulla quis rhoncus volutpat, eros risus hendrerit massa, at suscipit tortor magna at diam. Phasellus tincidunt massa libero, id bibendum dui dapibus sed. Etiam nec risus eget nisl posuere ultrices. Ut sodales ante eget leo luctus molestie. Aenean vel urna in turpis rhoncus scelerisque. Etiam in nisi sapien.</p>
<h1>L'Espagne</h1>
<p>Bla bla bla bla Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla hendrerit mauris a ornare. Nam finibus ante id lacinia placerat. Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec metus mauris, imperdiet eget tincidunt rhoncus, venenatis id risus. Proin at est eu nibh faucibus faucibus non in magna. Ut iaculis quam nisi, eu efficitur justo eleifend lobortis. Etiam purus metus, feugiat non enim et, egestas volutpat lacus. Aenean id justo arcu. Interdum et malesuada fames ac ante ipsum primis in faucibus.</p>
<p>Phasellus dictum aliquam euismod. Donec orci augue, efficitur non nunc vel, tincidunt mattis nibh. Suspendisse ac ligula non mauris semper fermentum ut eget dui. Aliquam erat volutpat. Curabitur vulputate, nulla quis rhoncus volutpat, eros risus hendrerit massa, at suscipit tortor magna at diam. Phasellus tincidunt massa libero, id bibendum dui dapibus sed. Etiam nec risus eget nisl posuere ultrices. Ut sodales ante eget leo luctus molestie. Aenean vel urna in turpis rhoncus scelerisque. Etiam in nisi sapien.</p>
<footer>
<p>Copyright Le Blog Trotter</p>
</footer>
</body>
</html>
et
/* Feuille de style */
ul
{
list-style: none;
}
#topsection
{
display:flex;
}
p
{
text-align:justify;
width:80%;
margin:auto;
}
mais bon je suis que une kiche de debutant . donc le resutat peut ne pas vous plaire monsieur les puriste
- Edité par apprenti padawan 5 janvier 2020 à 1:42:02
Avant de poster un message, vérifiez la date du sujet dans lequel vous comptiez intervenir.
Si le dernier message sur le sujet date de plus de deux mois, mieux vaut ne pas répondre. En effet, le déterrage d'un sujet nuit au bon fonctionnement du forum, et l'informatique pouvant grandement changer en quelques mois il n'est donc que rarement pertinent de déterrer un vieux sujet.
Au lieu de déterrer un sujet il est préférable :
soit de contacter directement le membre voulu par messagerie privée en cliquant sur son pseudonyme pour accéder à sa page profil, puis sur le lien "Ecrire un message"
soit de créer un nouveau sujet décrivant votre propre contexte
ne pas répondre à un déterrage et le signaler à la modération
Pas d'aide concernant le code par MP, le forum est là pour ça :)
Compos sui.
Compos sui.
Compos sui.
apprenti padawan