Partage
  • Partager sur Facebook
  • Partager sur Twitter

Questions MOOC HTML/CSS

    9 octobre 2018 à 0:31:53

    Oui mais si c'est sans limitation de taille c'est prendre le risque de la déformer
    • Partager sur Facebook
    • Partager sur Twitter

    Compos sui.

      9 octobre 2018 à 13:52:00

      Salut:

      no-repeat

      Elle est pourtant bien visible dans le cours celle là.

      • Partager sur Facebook
      • Partager sur Twitter
        9 octobre 2018 à 23:00:22

        ThierryGonthier a écrit: >

        oui mais quand j'applique no-repeat, l'image ne s'affiche pas en plein écran

        • Partager sur Facebook
        • Partager sur Twitter
          10 octobre 2018 à 1:11:48

          Re donc tu n'a qu'a jouer sur la largeur mais comme je t'ai dit je te le déconseille

          img{
          widht:100vw;
          heigth:0;
          }



          • Partager sur Facebook
          • Partager sur Twitter

          Compos sui.

            10 octobre 2018 à 14:55:56

            exen a écrit: >

            OK Merci bien

            • Partager sur Facebook
            • Partager sur Twitter
              10 octobre 2018 à 18:36:48

              Mais bon la déjà ca va agir sur toutes tes images, le mieux serrait de le faire en donnant une classe propre a ton image, si en plus le but est de la coller en background autant agir directement dessus avec ton width et ton height, mais comme je te l'ai dit ce n'est pas recommandé tu t'en rendras vite compte en changeant de taille d'écran
              • Partager sur Facebook
              • Partager sur Twitter

              Compos sui.

                12 octobre 2018 à 15:15:23

                Pb de code

                Bonjour à tous,

                Comme beaucoup j'ai le problème avec l'image mini et le lien pour avoir une grande.

                J'ai relu 15 000 le cours et repris me semble-til le code tel que mais cela ne marche pas non plus pour moi.

                J'ai un carré à la plce de la photo. Il y a bien un lien mis quand on clique on me dit que cela n'est pas ouvrable. 

                Quelqu'un pourrait nous aiguiller tous de façon claire sans jugement ou critique

                • Partager sur Facebook
                • Partager sur Twitter
                  12 octobre 2018 à 15:32:43

                  Bonjour Cécile,

                  Les photos sont-elle dans le même dossier que les fichiers .html et .css ?

                  Si ce n'est pas le cas, le chemin d'accès n'est pas le bon.

                  A+

                  -
                  Edité par Philippe2463 12 octobre 2018 à 15:33:02

                  • Partager sur Facebook
                  • Partager sur Twitter
                  La chute n'est pas un échec, l'échec c'est de rester là où on est tombé!
                    Staff 12 octobre 2018 à 18:26:54

                    @Cécile bonjour, pour insérer du code sur le forum merci d'utiliser le bouton code </> prévu à cet effet.

                    Pour votre premier code le src de votre image est faux, l'image doit ce trouver dans votre dossier de travail. Pas de liaison avec c://......

                    Pour votre deuxième code, votre image est t'elle bien dans le même répertoire que votre fichier HTML?

                    Bien qu'il soit possible d'omettre les guillemets, au stade de votre apprentissage il est plus rigoureux de les indiquer pour chaque valeur de chaque attribut HTML. Vous aurez moins de problème par la suite si vous être rigoureuse dans votre travail.

                      Autre chose, Pas de paragraphe autour d'une liste et tout autre block. Passer votre code au validateur pour voir vos erreurs https://validator.w3.org/

                    Voir également ce sujet https://openclassrooms.com/forum/sujet/balise-p-et-son-contenu

                    • Partager sur Facebook
                    • Partager sur Twitter
                      13 octobre 2018 à 0:42:39

                      Bonjour,

                      Je ne comprends pas vraiment les corrections que j'ai reçues : lorsque j'affiche la page dans mon navigateur, elle s'affiche très bien. Or notamment une personne a mentionné que ça ne s'affichait pas vraiment comme un CV... Comment se fait-il qu'il y ait des différences d'affichage aussi grande?

                      De la même façon, la photo s'affiche très bien sur mon navigateur, et je suis capable de l'agrandir sans pb ; or les 3 correcteurs ont mentionné qu'ils ne pouvaient pas l'agrandir. Mais je ne comprends pas d'où vient le problème, puisque dans mon fichier zip il y a bien les 3 fichiers (.htm, et mon image mini et mon image).

                      J'ai suivi le conseil précédent et passé mon code au validateur, et rien ne ressort par rapport aux images...

                      D'avance, un grand merci!

                      Camille

                      ps: et je seconde Cécile sur le "sans jugement" et "sans critique"... certains commentaires ne sont pas très agréables à lire dans les corrections.

                      • Partager sur Facebook
                      • Partager sur Twitter
                        13 octobre 2018 à 12:03:32

                        Bonjour à tous!

                        Je rencontre un problème avec le "pratiquez!"  après le cours sur flexbox.

                        Je n'arrive pas à voir pourquoi ces deux sections ne sont pas validées:

                        1/Une balise sémantique "nav" manque. Pouvez-vous l'ajouter au bon endroit ?

                        2/Placez le header et le menu côte à côte

                        Pouvez-vous m'éclairer ?

                        <!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>
                        
                        /* Feuille de style */
                        #menu
                        {
                          list-style-type: none;
                        }
                        
                        #topsection
                        {
                          display: flex;
                        }
                        
                        p
                        {
                          text-align: justify;
                          width: 80%;
                          margin: 0px auto;
                        }
                        





                        • Partager sur Facebook
                        • Partager sur Twitter
                        Soyez vous-même , tous les autres sont déjà pris. Oscar Wilde
                          13 octobre 2018 à 20:55:40

                          Resolue

                          -
                          Edité par CharleyPons 15 octobre 2018 à 3:42:18

                          • Partager sur Facebook
                          • Partager sur Twitter
                            14 octobre 2018 à 17:45:31

                            ZinaBrexel a écrit:

                            Bonjour à tous!

                            Je rencontre un problème avec le "pratiquez!"  après le cours sur flexbox.

                            Je n'arrive pas à voir pourquoi ces deux sections ne sont pas validées:

                            1/Une balise sémantique "nav" manque. Pouvez-vous l'ajouter au bon endroit ?

                            2/Placez le header et le menu côte à côte

                            Pouvez-vous m'éclairer ?



                            Bonjour, alors pour le balise nav , je ne comprends pas, moi ça passe, et j'ai fais comme toi. J'ai test en mettant tout sur une ligne des fois que soit une source d'erreur:

                            <!DOCTYPE html>
                            <html>
                               
                                    <nav><ul id="menu"><li><a href="#">Accueil</a></li>
                            <li><a href="#">Archives</a></li><li><a href="#">Contact</a></li></ul></nav>
                                
                            


                            Ça passe quand même, donc ça vient pas du code. Par contre tu as oublié une directive (;p) , à ta fonction display: flex du #topsection, ça c'est sûr.




                            • Partager sur Facebook
                            • Partager sur Twitter
                              14 octobre 2018 à 23:49:13

                              Bonjour à tous !

                              Premier message posté sur le forum,

                              je débute la partie CSS après le HTML.

                              2ème cours en ligne après "Les Bases du Web". Juste pour remercier OpenClassRooms, les cours sont très ludiques et bien expliqués ! C'est TOP ! Pour ma part, aucun soucis sur les corrections des autres étudiants, je vois que pour certains ça ne semble pas être le cas, c'est fort dommage :-/

                              Sinon, bah ...je n'avais aucune question car tout est fluide pour moi jusqu'à présent :-D

                              Bons cours et bon apprentissage à vous !

                              • Partager sur Facebook
                              • Partager sur Twitter
                                15 octobre 2018 à 16:44:53

                                Bonjour !

                                Juste pour prévenir que le commentaire d'une de mes corrections ne correspond PAS DU TOUT au contenu de mon CV ! Ce qui veut dire que la personne m'a noté pour un autre CV que le miens. Du coup un 0/4 à coté de mes 2 4/4, ça fait TELLEMENT plaisir :)

                                • Partager sur Facebook
                                • Partager sur Twitter
                                Born || ̶R̶i̶s̶e̶ || Shadow
                                  Staff 15 octobre 2018 à 16:56:53

                                  Bonjour MicroCroft,

                                  Afin de vous assurer d'avoir une réponse le plus rapidement possible, je vous invite à directement contacter l'équipe du site via l'adresse hello@openclassrooms.com. En effet, l'équipe du site ne passant que très rarement sur les forums, il sera beaucoup plus efficace de les contacter directement.

                                  • Partager sur Facebook
                                  • Partager sur Twitter

                                  Pas d'aide concernant le code par MP ni par mail, le forum est là pour ça :) Postez votre code html et css (bouton '</>') !!

                                    15 octobre 2018 à 17:26:27

                                    Bonjour Lamecarlate,

                                    Je venais surtout pour me plaindre un peu, parce qu'en explication il y a :

                                    C'est le système de correction qui devrait être changé.

                                    Pour ma part je sais que j'ai réussi l'exercice et je ne paye pas d'abonnement donc pas de grande inquiétude, juste de l'agacement.

                                    Mais merci beaucoup pour ta réponse, je vais quand même essayer, ne sait on jamais !

                                    • Partager sur Facebook
                                    • Partager sur Twitter
                                    Born || ̶R̶i̶s̶e̶ || Shadow
                                      15 octobre 2018 à 18:05:10

                                      alors ils sont entrain de faire une nouvelle version après ta déduction est assez spéciale
                                      • Partager sur Facebook
                                      • Partager sur Twitter
                                      Un jour les Valaisans domineront le monde. Mais pas demain, ya apéro
                                        16 octobre 2018 à 10:17:29

                                        Bonjour,

                                        Je suis bloquée depuis hier sur l'exercice de pratique de mise en page du site.

                                        J'ai revérifié plusieurs fois mon code, tenté de nombreuses alternatives mais rien n'y fait, impossible de valider les tâches suivantes :

                                        • Une balise sémantique "nav" manque. Pouvez-vous l'ajouter au bon endroit ?
                                        • Placez le header et le menu côte à côte
                                        • Affichez les paragraphes en justifié, sur 80% de largeur et centrez leurs blocs sur la page

                                        Pouvez-vous m'aider s'il vous plait ? Merci par avance

                                        Voici mon code HTML :

                                        <!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>
                                        
                                        <section id="contenu">
                                            <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>
                                        </section>
                                              
                                            <footer>
                                              <p>Copyright Le Blog Trotter</p>
                                            </footer>
                                              
                                          </body>
                                        </html>
                                        

                                        et mon CSS :

                                        /* Feuille de style */
                                        #topsection
                                        {
                                          display: flex;
                                          flex-direction: row-reverse;
                                          justify-content: space-around;
                                        }
                                        
                                        #menu
                                        {
                                          list-style-type: none;
                                          flex: 1;
                                          margin: 20px;
                                          padding: 10px;
                                        }
                                        
                                        header
                                        {
                                          padding: 20px;
                                          flex: 6;
                                          text-align: justify;
                                          margin: 0;
                                        }
                                        
                                        p
                                        {
                                          text-align: justify;
                                          width: 80%;
                                          margin: auto;
                                          background-color: #CCCCCC;
                                        
                                        }
                                        
                                        h1
                                        {
                                          background-color: #228616;
                                          align: left;
                                        }
                                        

                                        Merci par avance pour votre aide


                                        • Partager sur Facebook
                                        • Partager sur Twitter
                                          16 octobre 2018 à 12:06:18

                                          NadouDilemma a écrit:

                                          Bonjour,

                                          Je suis bloquée depuis hier sur l'exercice de pratique de mise en page du site.

                                          J'ai revérifié plusieurs fois mon code, tenté de nombreuses alternatives mais rien n'y fait, impossible de valider les tâches suivantes :

                                          • Une balise sémantique "nav"[...] header et le menu côte à côte[...] paragraphes en justifié, sur 80%

                                          Pouvez-vous m'aider s'il vous plait ? Merci par avance

                                          Bonjour, bonne nouvelle, j'ai rien vu de spéciale, du coup j'ai fait un copier/coller (des fois que je sois un nivoirien) et : bingo: tout fonctionne, l'exercice est validé.

                                          Non, bah en fait, en ciblant mieux c'est ton header qui fiche le basard. Enlève le et ça passe.



                                          -
                                          Edité par ThierryGonthier 16 octobre 2018 à 12:23:47

                                          • Partager sur Facebook
                                          • Partager sur Twitter
                                            16 octobre 2018 à 17:03:07

                                            CamilleButzbach a écrit:

                                            Bonjour,

                                            Je ne comprends pas vraiment les corrections que j'ai reçues : lorsque j'affiche la page dans mon navigateur, elle s'affiche très bien. Or notamment une personne a mentionné que ça ne s'affichait pas vraiment comme un CV... Comment se fait-il qu'il y ait des différences d'affichage aussi grande?

                                            De la même façon, la photo s'affiche très bien sur mon navigateur, et je suis capable de l'agrandir sans pb ; or les 3 correcteurs ont mentionné qu'ils ne pouvaient pas l'agrandir. Mais je ne comprends pas d'où vient le problème, puisque dans mon fichier zip il y a bien les 3 fichiers (.htm, et mon image mini et mon image).

                                            J'ai suivi le conseil précédent et passé mon code au validateur, et rien ne ressort par rapport aux images...

                                            D'avance, un grand merci!

                                            Camille

                                            ps: et je seconde Cécile sur le "sans jugement" et "sans critique"... certains commentaires ne sont pas très agréables à lire dans les corrections.


                                            Bonjour,

                                            Je me permets de reposer ma question concernant les images : j'ai zippé le .html, le fichier image initial et le fichier image mini ensemble, or les correcteurs ne voient pas mon image en cliquant dessus, et je ne comprends pas pourquoi. Quelqu'un saurait-il m'expliquer? Un grand merci.

                                            Camille

                                            <p><a href="logo.png"><img src="logo_mini.png" alt="Logo mobilité" title="Logo de Camille"/></a></p>



                                            • Partager sur Facebook
                                            • Partager sur Twitter
                                              16 octobre 2018 à 17:23:36

                                              @CamilleButzbach:

                                              Comment as tu organisé ton fichier zip?

                                              -
                                              Edité par ThierryGonthier 16 octobre 2018 à 17:24:21

                                              • Partager sur Facebook
                                              • Partager sur Twitter
                                                16 octobre 2018 à 19:34:56

                                                ThierryGonthier a écrit:

                                                @CamilleButzbach:

                                                Comment as tu organisé ton fichier zip?

                                                -
                                                Edité par ThierryGonthier il y a environ 1 heure


                                                Bonjour Thierry,

                                                En fait j'ai sélectionné mon .html, et mes deux .png pour faire mon fichier zip (donc mes .png ne sont pas dans un dossier particulier, ni mon .html).

                                                Merci,

                                                Camille

                                                • Partager sur Facebook
                                                • Partager sur Twitter
                                                  16 octobre 2018 à 19:47:06

                                                  ThierryGonthier a écrit:

                                                  Bonjour, bonne nouvelle, j'ai rien vu de spéciale, du coup j'ai fait un copier/coller (des fois que je sois un nivoirien) et : bingo: tout fonctionne, l'exercice est validé.

                                                  Non, bah en fait, en ciblant mieux c'est ton header qui fiche le basard. Enlève le et ça passe.

                                                  Bonjour,

                                                  Merci pour votre relecture. Ce que je ne comprends pas, c'est que ce header est celui de l'exercice, je ne l'ai absolument pas codé... Je ne peux malheureusement pas le supprimé puisque la tâche suivante (qui ne fonctionne pas non plus) consiste à mettre côte à côte le header et le menu

                                                  -
                                                  Edité par NadouDilemma 16 octobre 2018 à 19:48:18

                                                  • Partager sur Facebook
                                                  • Partager sur Twitter
                                                    16 octobre 2018 à 20:23:48

                                                    NadouDilemma a écrit:

                                                    ThierryGonthier a écrit:

                                                    Bonjour, bonne nouvelle, j'ai rien vu de spéciale,[...] , en ciblant mieux c'est ton header qui fiche le basard. ...

                                                    Bonjour,

                                                    Merci pour votre relecture. Ce que je ne comprends pas, c'est que ce header est celui de l'exercice, je ne l'ai absolument pas codé... Je ne peux malheureusement pas le supprimé puisque la tâche suivante (qui ne fonctionne pas non plus) consiste à mettre côte à côte le header et le menu

                                                    -
                                                    Edité par NadouDilemma il y a 4 minutes

                                                    Je veux dire dans le css, enlève le header (et tout ces attributs) du fichier css et ça fonctionne. Comme il est en justify mais pas dans le même bloc, du coup ça doit générer des erreurs dans la correction automatique (théorie théorique...). Au départ je pensais que c'était le background du h1.

                                                    @CamilleButzbach:

                                                    Post ton code en entier s'il te plaît. Et ne mets plus d'image dans des balises paragraphe, y a <figure> pour ça.

                                                    -
                                                    Edité par ThierryGonthier 16 octobre 2018 à 20:39:40

                                                    • Partager sur Facebook
                                                    • Partager sur Twitter
                                                      17 octobre 2018 à 18:18:57

                                                      @ThierryGonthier

                                                      Voici un extrait de mon code (j'ai enlevé les autres paragraphes) :

                                                      Une autre petite question: on ne met pas les balises paragraphes ni pour les images, ni pour les listes (ul), c'est ça?

                                                      Un grand merci pour votre aide,

                                                      Camille

                                                      <!DOCTYPE html>
                                                      <html>
                                                      <head>
                                                      	<meta charset="UTF-8"/>
                                                      	<title>Cv Camille</title>
                                                      </head>
                                                      <body>
                                                      	<h1>Camille Butzbach</h1>
                                                      	<p>Conseillère en aménagement</p>
                                                      	<a href="logo.png"><img src="logo_mini.png" alt="Logo mobilité" title="Logo de Camille"/></a>
                                                      
                                                      	<h2>Expérience professionnelle</h2>
                                                      	<ul>
                                                      		<li><em>Coordinatrice de projet en aménagement et santé publique</em></li>
                                                      		<li><em>Conseillère en aménagement</em></li>
                                                      		<li><em>Auxiliaire de recherche</em></li> 
                                                      	</ul>
                                                      
                                                      	
                                                      	
                                                      </body>
                                                      </html>



                                                      • Partager sur Facebook
                                                      • Partager sur Twitter
                                                        17 octobre 2018 à 20:46:20

                                                        Le code en lui même, il est bon (toujours pas de balise figure ;p ) je remplace avec des images à moi ça marche. Reste plus que le nom du fichier, change le, vire le underscore (surtout parce il ne reste que ça), met un nom ou y a pas d'embrouille, en un seul mot et re-test (en même temps chez toi ça fonctionne , donc on sera pas plus avancé). Ensuite mets tout dans un dossier avant de ziper, ça évitera des problèmes pour la suite. Avant CSS on m'était toute les indications de taille et de localisation sur la page en jouant sur les marges, directement dans la balise img, comme alt et title. C'était un foutoire incroyable, des bugs d'affichage à tour de bras en veux tu en voilà. Mais là... Y a vraiment pas de raison d'être embêter comme ça sur une image.

                                                        Les listes par les temps qui cours c'est souvent des menus de navigation, donc : nav. Mais si c'est une liste d’énumération dans un paragraphe qui énumère quelque chose, il sera dans le paragraphe au même titre que n'importe quelle phrase de celui-ci.

                                                        Tu peux avoir une image dans un paragraphe, pour illustrer le propos. Mais ne mets pas une image toute seule dans des balises paragraphe, y a <figure> pour ça.

                                                        • Partager sur Facebook
                                                        • Partager sur Twitter
                                                          17 octobre 2018 à 20:56:24

                                                          Hello,

                                                          Pour info : il est écrit dans le cours qu'une image doit être obligatoirement placée dans un paragraphe <p>.

                                                          C'est totalement faux, l'erreur à déjà été signalée, reste au rédacteur de rectifier son propos.

                                                          • Partager sur Facebook
                                                          • Partager sur Twitter
                                                            17 octobre 2018 à 21:09:35

                                                            @Thierry Merci beaucoup pour tous ces conseils et les pistes de solution, je vais essayer! Merci d'avoir pris le temps de me répondre en tout cas :)

                                                            • Partager sur Facebook
                                                            • Partager sur Twitter
                                                              17 octobre 2018 à 21:59:37

                                                              Dans la vidéo du cours « les image » https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3/1604791-les-images

                                                              à 3 minutes 06 seconde, Mathieu dit : « l’image doit être contenu dans qualque chose, le plus souvent se sera dans un paragraphe »

                                                              à 3 minutes 56 de la même vidéo, Mathieu dit : « il faut notamment connaître quelques balises qui sont apparu avec HTML5 qui sont : fugure et figurecaption pour dire que l’image à un sens dans la page que vous voulez la mettre en valeur et un libellé ».

                                                              Et tu verras bien ce qui se passe quand dans ton fichier CSS tu mettras un traitement à p et que l’image subira le même sort. Il me semble que ça tombe donc sous le sens qu’il faut distinguer l’image illustrative (dans le paragraphe) de l’image « séparer » du paragraphe.

                                                              Mais je comprends ton insistance quant dans le cours il est écrit :

                                                              Les images doivent se trouver obligatoirement à l'intérieur d'un paragraphe (<p></p>). Voici un exemple d'insertion d'image :

                                                              Mais comme le HTML est plein de subtilité, dans le même cours on trouve aussi ceci :

                                                              https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3/1604791-les-images#/id/r-1609843

                                                              Bien comprendre le rôle des figures

                                                              Un peu plus tôt dans ce chapitre, je vous ai dit que les images devaient être situées dans des paragraphes (placées à l'intérieur d'une balise  <p></p>). Ce n'est pas tout à fait vrai.

                                                              Si vous faites de votre image une figure, l'image peut être située en-dehors d'un paragraphe.

                                                              C’est pourquoi je te renverrai à ces discussions sur le sujet :

                                                              https://openclassrooms.com/forum/sujet/pourquoi-la-balise-lt-imggt-dans-lt-pgt-92984

                                                              https://www.developpez.net/forums/d1425407/webmasters-developpement-web/mise-page-css/texte-sous-image/

                                                              Le W3C identifie effectivement plusieurs « type » d’image en fonction de leur utilité :

                                                              https://www.w3.org/WAI/tutorials/images/

                                                              Merci d’avoir ouvert le sujet.

                                                              P.S : lorsque tu dis : , «  l'erreur à déjà été signalée, reste au rédacteur de rectifier son propos », peux tu y joindre un lien que l’on puisse se documenter ?

                                                              @Camille : coèze !!

                                                              • Partager sur Facebook
                                                              • Partager sur Twitter

                                                              Questions MOOC HTML/CSS

                                                              × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                                                              • Editeur
                                                              • Markdown