Partage
  • Partager sur Facebook
  • Partager sur Twitter

probleme avec les marges

activite organiser cv

    12 octobre 2017 à 19:56:16

    je veut un premier bloc qui couvre tout la page web. dans ce bloc je veut 2 bloc. un pour le lisere et lautre pour le reste(le texte l'image). je veut que le bloc du lisere soit positionner completement a gauche et quil prenne 20% de la page en largeur et prenne 100% en longueur. je veut que mon deuxieme bloc soit positionner completement a droite et quil ai une largeur de 80% de la page. J'ai essayer a mainte reprise mais ne suit jamais arriver au resultat souhaite merci beaucoup!

    -
    Edité par witlish 15 octobre 2017 à 20:54:57

    • Partager sur Facebook
    • Partager sur Twitter
      12 octobre 2017 à 20:02:28

      Bonjour,

      Avant tout, je peux t'assurer que c'est possible, j'ai suivi le même cours que toi et j'y suis arrivé, je suis pourtant pas une lumière :3

      Je te conseil de bien relire le cours, et de réessayer, après tout, le forum n'est pas là pour faire les exercices à ta place :/

      Si malgré ça tu n'y arrives toujours pas, pourquoi ne pas partager ton code, on pourrait alors t'expliquer ce qui ne vas pas et le corriger plutôt que de fournir bêtement la solution

      PS : N'oublie pas d'utiliser les Balises de <code> et ajoute le fichier HTML, pas seulement le CSS

      Bon courage !

      • Partager sur Facebook
      • Partager sur Twitter
        12 octobre 2017 à 20:09:01

        Salut, voici mon code html je  n'est pas encore de code css :

        -
        Edité par witlish 12 octobre 2017 à 20:35:39

        • Partager sur Facebook
        • Partager sur Twitter
          12 octobre 2017 à 21:51:20

          Bonsoir , ( point 1 de la charte de bonne conduite et cela fait également partie de règles de bonne communication lorsque l'on s'adresse à des humains)

          Je t'invite à éditer ton premier message afin d'en modifier le titre de ton sujet, car «Besoin d'aide html css» n'est pas explicite de la problématique que tu rencontres. Merci (Point 3 de la charte de bonne conduite.)

          Et tant que tu y es "je veut", ne serais ce pas plutôt "J'aimerais"? Merci également de nous fournir ton code html et css en utilisant le bouton code </> .

          • Partager sur Facebook
          • Partager sur Twitter
            14 octobre 2017 à 18:55:26

            ÉmileGagnon1 a écrit:

            Salut, voici mon code html je  n'est pas encore de code css :

            -
            Edité par ÉmileGagnon1 12 octobre 2017 à 20:35:39


            Hey,

            Navré mais ton code s'est vu supprimé (je t'avais dis d'utiliser <code> :p)

            Autrement et Pour info, tu dis ne pas avoir de code CSS, impossible de faire ce que tu demande sans le CSS ! Je t'invite à continuer le cours en suivant Ce lien

            Bonne soirée !

            • Partager sur Facebook
            • Partager sur Twitter
              14 octobre 2017 à 19:06:44

              Je pense que c'est possible dans le code html avec

              <div style= ...>contenu</div>

              mais vraiment pas pratique. Tu a l'air de ne pas avoir suivi suffisamment le cours. Je t'invite à suivre le lien de xXFurtiiVytiiZz et si tu as besoin de plus de cours .

              Bonne lecture ^^

              -
              Edité par KFoxLDG 14 octobre 2017 à 19:07:06

              • Partager sur Facebook
              • Partager sur Twitter
                15 octobre 2017 à 17:19:03

                donc voici mes codes mon probleme est que le lisere ne prend pas tout 
                lespasce en hauteur et a une marge a sa gauche que je ne peut pas 
                enlever. Pour ceux qui doute j'ai tres bien suivi les cours margin ne 
                marche pas et heigth:100% non plus. Merci de votre aide.

                <!DOCTYPE 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>
                @font-face {
                    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;
                }


                -
                Edité par witlish 15 octobre 2017 à 17:25:30

                • Partager sur Facebook
                • Partager sur Twitter
                  15 octobre 2017 à 18:21:33

                  Pour résoudre ton problème de marge il faut que tu saches que body à par défaut une marge (je suis pas sûr mais j'ai quand même un peu vérifié.) donc essaye ça

                  body{
                     margin:0px 0px 0px 0px;
                  }


                  Pour le reste je sais pas trop.

                  • Partager sur Facebook
                  • Partager sur Twitter
                    15 octobre 2017 à 18:34:54

                    Bonjour,

                    petite remarque :  margin: 0px 0px 0px 0px; c'est juste, mais il y a beaucoup plus simple avec margin: 0;.

                    En effet, si les 4 valeurs sont identiques elles peuvent être ramenées à une seule, et si la valeur est "0" nul besoin de mettre une unité (zéro patate c'est exactement pareil que zéro tomate, l'assiette est vide de la même manière :( ).

                    witlish > pense à modifier ton titre comme te l'a demandé AbcAbc6.

                    • Partager sur Facebook
                    • Partager sur Twitter

                    Pas d'aide concernant le code par MP, le forum est là pour ça :)

                    Anonyme
                      15 octobre 2017 à 18:35:21

                      KFowLDG

                      Un « margin: 0 » serait plus rapide 😁

                      • Partager sur Facebook
                      • Partager sur Twitter
                        15 octobre 2017 à 19:36:31

                        merci tout le monde ca a regler mon probleme comment pu-je changer le titre?

                        -
                        Edité par witlish 15 octobre 2017 à 19:38:36

                        • Partager sur Facebook
                        • Partager sur Twitter
                          15 octobre 2017 à 19:41:00

                          witlish a écrit:

                           comment pu-je changer le titre?

                          bonsoir, en éditant ton premier message.

                          • Partager sur Facebook
                          • Partager sur Twitter

                          probleme avec les marges

                          × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                          × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                          • Editeur
                          • Markdown