je n'arrive pas à envoyer mes documents html et css en fichier compressé zip, quand je le fais mon lien html n-affiche ni image ni le formatage du css pouvez vous me dire comment il faut procéder ? merci d'avance
Bonjour je suis débutant, j'ai réussi à faire un espace membre pour mes débuts, cependant je n'arrive pas reproduire cela en html/css , Pouvez vous m'aider ?
Dans un souci de simplicité pour les réponses te serrait il possible de poser ta question dans le forum CSS/HTML en te créant un sujet rien que pour toi, ce serras bien plus pratique pour répondre à ta question.
En gros tu va faire un container qui va englober deux container, dans chacun de ces container tu va placer un container pour l'image, un pour le prix et un en position absolute avec un z-index 1 pour ta pastille.
je sollicite le forum pour la 1ère fois, je viens de finaliser l'exercice du CV sur HTML (avec insertion petite image amenant vers une plus grande version de cette image).
Voulant envoyer le résultat en créant un document.ZIP, je vois que le cheminement de mon image n'est plus viable, alors que c'est le bon lien sans le compressage.
J'ai tenter de regroupé mes 2 images et mon code dans un sous-document, et dans ce cas de figure, il n'y a aucun soucis, les liens sont actifs et l'image de la miniature apparaît bien.
Avez-vous une idée, de comment résoudre ce problème?
<body> <h1><strong>Caroline Perron</strong></h1> <p> Organisée, rigoureuse avec le sens des responsabilités<br> </p>
<p> voici ma main, si vous souhaitez la voir agrandit, cliquez dessus! <a href="cv_main_grande_taille.jpg"><img src="cv_main_miniature.jpg"alt="photo de ma main"title="cliquez pour agrandir"/></a> </p>
<p> <h2><strong>Expériences</strong></h2> <ul> <li>2014-2018: Chargée de communication, La bière des gorges, Saint-Martin de Brômes</li> <li>2011-2013: Chargée de mission, Région Sud</li> <li>2010-2011: Attachée de production, Watcha Clan Marseille</li> </ul> </p>
@Caroline Bonjour, vous voulez dire qu'en ouvrant votre fichier .html au départ d'un .zip vous ne voyez plus l' image? Si c'est cela c'est normal puisque le fichier .html une fois sorti ne sais pas lier les images qui ce trouve dans le .zip.
Ce qu'il faut faire, et que vous devrez faire lorsque vous corrigerez vos pairs, c'est de dézippez (extraire) TOUS les fichiers. Ainsi la liaison entre les fichier ce ferra correctement.
Pour votre code, (qu'il faut insérer sur le forum avec le bouton code </> (deuxième bouton en commençant par la droite au dessus de la zone ou vous écrivez)) il y as des erreurs que vous pouvez voir au validateur https://validator.w3.org/#validate_by_input
A savoir qu'il ne faut pas écrire de balise bock dans un paragraphe qui n'accepte que du contenu phrasé. Donc pas de <ul> ni de titre dans un paragraphe. Un paragraphe est une subdivision d'un texte.
Autre erreur, les attributs doivent être séparer par un espace. L'erreur ce trouve dans la balise <img>.
@AbcAbc6 merci pour la qualité de vos remarques et liens.
Pour le dézippage je n'ai pas vu cette fonction, en même temps je suis sur un ordi rafistolé de toutes parts et donc il manque certains ou partie de logiciels.
Je ne sais pas si le tableau de bord est accessible par quelqu'un d'autre que toi. Fais un test, copie le lien sur le tableau bord, déconnecte toi et vois si tu y a accès.
Re-bonjour @ThierryGonthier et la communauté d'Openclassrooms,
je n'ai pas réussi à transmettre à un tiers ma page "tableau de bord", comment peut on transmettre sa progression à une autre personne que soi, sans lui donner les codes d'accès à mon compte?
C'est précisément le problème quand on a pas le code en entier, on ne peut pas présumer de "l'environnement" générale (est ce que y a les balises qu'il faut autour, est ce que c'est la disposition des block qui embĉhe le margin, etc...). C'est pour ça qu'il est demandé de poster le code en entier et surtout en utilisant le bouton </> en haut de la de saisie de texte à coté de G, I et A.
Je ne sais pas si il faut déterrer un vieux sujet ou le poster ici. Enfaite je suis rendu a l'activité "HTML 5-Semaine3". Je dois faire un liseré a gauche mais malheureusement je "block" . Je n'arrive pas a le faire descendre jusqu'au bas de la page. Auriez-vous des conseils a me prodiguer ? Merci d'avance !
En ce moment, j'essaie de comprendre comment faire l'exercice présenté sur le cours en question dont fait référence ce sous-forum.
La question est : « Affichez les paragraphes en justifié, sur 80% de largeur et centrez leurs blocs sur la page.
Voici mes codes :
<!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>
<class = "paragraphes" block>
<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><block/>
<footer>
<p>Copyright Le Blog Trotter</p>
</footer>
</body>
</html>
/* Feuille de style */
li {
list-style:none;
}
header, nav {
width: 30%;
height: 30%;
}
p {
display:flex;
justify-content: center;
align-items: center;
text-align:justify;
width:80%;
}
#topsection {
display:flex;
}
J'ai essayé à peu près tout ce qui me paraissaient possibles au niveau du CSS3, mais j'ai vraiment de la difficulté à comprendre le Flexbox...
Merci beaucoup de m'aider à l'avance.
- Edité par Marie-Ange Bussière 20 juin 2019 à 11:43:33
Tu confonds <head> et <header>, du coup tu à mis deux fois <head> (ligne 11).
La balise <article> au même titre qu'une <div> créer aussi un bloc (ça n'est pas que de la sémantique) du coup je pense que ta div ligne 29 <div id="conteneur2"> est superflu et risque de te casser les pieds avec flex box.
<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 class="paraBlock">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 class="paraBlock">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 class="paraBlock">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 class="paraBlock">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><block/>
<footer>
<p>Copyright Le Blog Trotter</p>
</footer>
Bonjour, j'ai rencontré un problème dans mon rendu CSS.
J'ai 4 input mais dont 1 que j'ai rajouté dernièrement quand au autres (ils y sont depuis plus longtemps). Quand je custom le dernier input, et que je met a jour mon site, rien ne se passe et quand j'inspecte la page par le navigateur, le bloc pour cet input n'apparaît pas.mais quand je vais sur mon site par le biais de me téléphone la l'input est bien customiser.
Si quelqu'un aurait une réponse a cela, je suis preneur 😉
Compos sui.