Partage

organiser ses blocs

activite organiser cv

12 octobre 2017 à 23:15:05

Bonjour tout le monde, je suis bloquer depuis deux jours sur l'activite "organiser son cv". Mon probleme est avec le lisere-.- J'ai essayer a de multiple reprise plusieurs technique differrente. certaine fois le lisere etait la mais il ne faisait pas tout la longueur du site ou il yavait une marge a gauche que je ne pouvais pas enlever. J'aimerais qu'on me guide pour m'aider a comprendre comment on organise ses blocs pour que par la suite je puisse organiser mon cv. J'ai lu et relu les chapitres sur l'organisation j'ai fait mes recherches sur le web,regarder des tutos ,mais je ne comprend toujours pas. Merci d'avance!

mon code html:


<html>
    <head>
        <meta charset="utf-8" />
        <title>Curriculum vitae de Jean Dupont</title>
        <link rel="stylesheet" href="style.css" />
    </head>

    <body>
    <div class="tout">       
           
            <div class="imglisiere">
                <img src="lisere.jpg" alt="lisere">
            </div>

    <div class="centrale">
       <header><h1><strong>Jean Dupont</strong></h1>
         <p>Élève sur OpenClassroom. </br>
       
          <div id="conteneurimages">
            <div class="images"><a href="jeandupont.jpg"><img src="jeandupont2.jpg" class="photojean" alt="photo de jean dupont"></a></div>
            <div class="images"><a href="jeandupont.jpg"><img src="jeandupont2.jpg" alt="photo de jean dupont"></a></div>
            <div class="images"><a href="jeandupont.jpg"><img src="jeandupont2.jpg" class="photojean" alt="photo de jean dupont"></a></div>
          </div>
         </p>
       
        </header>

          </br>
       
        <section>
        <div id="conteneur">
        <div class="element">
            <h2> Mon expérience</h2>                                  
              <ul>
                 <li>Geek a temps partiel</li>
                 <li>Procrastinateur a temps plein</li>
                 <li>Joueur de jeux video depuis mes 4 ans</li>
              </ul>
        </div>
        <div class="element">
      
            <h2> Mes competences</h2>
                <ul>
                   <li>Je connais mieu que quiquonque les geeks</li>
                   <li>Je m'endors en 1 minute</li>
                   <li>Je suis le meilleur au monde au jeu video</li>
               </ul>
        </div>
       
        <div class="element">
            <h2> Ma formation</h2>
                <p>Mes freres m'ont presque tout appris.Le</br>reste je l'ai apprit en regardant des tutos.</p>
        </div>
       
        </div>
        </section>

    </body>

</html>

mon code css:


    font-family: 'ambleregular';
    src: url('fonts/Amble-Regular-webfont.eot');
    src: url('fonts/Amble-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Amble-Regular-webfont.woff2') format('woff2'),
         url('fonts/Amble-Regular-webfont.woff') format('woff'),
         url('fonts/Amble-Regular-webfont.ttf') format('truetype'),
         url('fonts/Amble-Regular-webfont.svg#ambleregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

h2,ul
{
    font-family: 'ambleregular', Impact, "Arial Black";
    border-radius: 6px;
}

h2
{
    color: fuchsia;
}

h2+p
{
    font-family: 'ambleregular';
}

h1, h1+p
{
    text-align: center;
}

.photojean
{
    border: 3px fuchsia inset;
}

body
{

    background-image: url("blanc.jpg");

}
figure
{
    box-shadow: 6px 6px 0px fuchsia;
}
#conteneur
{
    display: flex;
    justify-content: flex-end;
}
#conteneurimages
{
    display: flex;
    justify-content: center;
}
.imglisiere
{
    width:250px;
    overflow: hidden;
    display: inline-block;
    height: 60%;
}
.centrale
{
    display: inline-block;
    vertical-align: top;
}
.tout
{
    display: flex;
    justify-content: space-between;
}

Staff 13 octobre 2017 à 5:21:40

Bonjour, inutile de créer un nouveau sujet, modifie le titre de ton précédant sujet comme je l'ai demandé ( pour ce faire édite ton premier message)et pour poster un code sur le forum utilise le bouton code </> ici

bouton code

Je ferme le doublon. Je reste disponible par MP si tu as des difficultés à utiliser les forums OC.

-
Edité par AbcAbc6 13 octobre 2017 à 5:26:18

Se démerder tout seul (par grafikart)