Partage
  • Partager sur Facebook
  • Partager sur Twitter

ENTRAINEZ VOUS EN ORGANISANT VOTRE CV 3

    25 septembre 2021 à 23:02:39

    salut.j'apprends le html et css et je suis arrivé à l'activité 3 de pratique.Mais le problème c'est que j'y bloque de puis des heures! Je n'arrive pas à aligner les séctions . Alors voilà mon code et je vous prie de m'aider : 

    HTML:

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8" />
            <link rel="stylesheet" href="style.css" />
            <title>GON</title>
        </head>
        <body><section>
            <header>
            <h1>gon</h1>
            <figure> 
                <!-- image générée grace à une IA(je tiens à préciser)-->
               <a href="cv.png" ><img alt="mon_img" src="real.png"/></a>
           </figure>
    </header>
    
    <article>
        <div class="element">
            <h2>mon experience</h2>
            <p>
    <ul>
            <li>chaque jour de ma vie est une experience.</li>
    <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
    <li>Suspendisse malesuada dolor non dignissim interdum.</li>
    </ul>
    </p>
     </div>
        </article>
    
       <article>
        <div class="element">
        <h2>mes compétences</h2>
    
        Sait faire une mise en page d'un site.<br>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec hendrerit eros nec bibendum finibus. In ultrices augue tincidunt libero suscipit suscipit. Mauris purus elit, finibus tempus turpis eget, ultricies tincidunt orci. Interdum et malesuada fames ac ante ipsum primis in faucibus. Phasellus aliquam interdum dui nec rhoncus. Phasellus non sagittis magna. Integer eleifend arcu id metus rutrum egestas. Nam fermentum aliquet lorem, a gravida mi congue ac. Proin venenatis sed mi ac porta. Ut mollis sapien risus, eget fermentum metus condimentum in.
    </div>
    </article>
    
    <article>
        <div class="element">
      <h2>ma formation</h2>
      <p>j'ai été formé grâce à openclassroom bien sûr !</p>  
    </div>
    
    </article>
    </section>
    
    
    
        </body>
    
    </html>
    body
    {
        background-image: url(fond.png);
        font-family: arial,georgina;
        font-size: 1,3em;
    }
    
    header
    {
        display: flex;
        justify-content: center;
    
    }
    h1
    {
        flex: 2;
        text-align: center;
    }
    
    img 
    {
        float: left;
    }
    
    .element
    {
        text-align: justify;
        word-wrap: normal;
        flex-direction: row;
        display: inline-block;
    }
    article
    {
        max-width: 25%;
        margin: 10px;
        display: flex;
        flex-direction: row;
        justify-content:space-between;
        align-items: center;
    }
     je crois qu'il y a énormément d'erreurs dans le code et j'espère que vous m'aideriez à les réctifier.
    • Partager sur Facebook
    • Partager sur Twitter
      26 septembre 2021 à 1:36:33

      Bonjour, Merci de retirer toutes les lettres en capitale de votre titre.

      Majuscules abusives

      L'écriture en majuscules est considérée comme une parole criée et diminue autant la lisibilité du texte que sa compréhension. Les majuscules abusives sont donc interdites aussi bien dans les titres que dans les messages.

      Liens conseillés


      Bonsoir, commencer par indenter votre code correctement, ce sera plus claire pour vous relire et pour ceux qui vous lisent.

      Passez votre code au validateur pour voir et corriger vos erreurs => https://validator.w3.orget pour le CSS http://jigsaw.w3.org/css-validator 

      On ne place pas une liste dans un paragraphe qui n'accepte que du contenu phrasé.

      >> Je n'arrive pas à aligner les séctions

      Horizontalement? Entoure tes articles d'un <div> que tu indiques en display: flex;

      • Partager sur Facebook
      • Partager sur Twitter

      ENTRAINEZ VOUS EN ORGANISANT VOTRE CV 3

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