Déformation de mon site à cause de bootstrap
Résolu/Fermé
Wanss
Messages postés
6
Date d'inscription
mardi 23 février 2021
Statut
Membre
Dernière intervention
24 février 2021
-
23 févr. 2021 à 23:38
Wanss Messages postés 6 Date d'inscription mardi 23 février 2021 Statut Membre Dernière intervention 24 février 2021 - 24 févr. 2021 à 00:16
Wanss Messages postés 6 Date d'inscription mardi 23 février 2021 Statut Membre Dernière intervention 24 février 2021 - 24 févr. 2021 à 00:16
A voir également:
- Déformation de mon site à cause de bootstrap
- Site de telechargement - Guide
- Site de vente entre particulier - Guide
- Site inaccessible - Guide
- Site de partage de photos - Guide
- Darkino site - Guide
6 réponses
jordane45
Messages postés
38167
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
7 mai 2024
4 657
23 févr. 2021 à 23:43
23 févr. 2021 à 23:43
Bonjour,
Quel rapport avec le .NET ?
Quel code as tu écrit exactement ?
( à noter que tu dois importer le css de bootstrap.. AVANT tes autres css... )
PS: Pour poster du code sur le forum, tu devras utiliser les balises de code.
Explications ( à lire ENTIEREMENT !! ) disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code
Quel rapport avec le .NET ?
Quel code as tu écrit exactement ?
( à noter que tu dois importer le css de bootstrap.. AVANT tes autres css... )
PS: Pour poster du code sur le forum, tu devras utiliser les balises de code.
Explications ( à lire ENTIEREMENT !! ) disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code
Wanss
Messages postés
6
Date d'inscription
mardi 23 février 2021
Statut
Membre
Dernière intervention
24 février 2021
Modifié le 23 févr. 2021 à 23:51
Modifié le 23 févr. 2021 à 23:51
Voici mon code html
EDIT: Correction des balises de code ( langage HTML et non CSHARP )
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="bborder"> <p class="intro"><strong>Bonjour,</strong> <p class="introduction"><strong>Je suis Noé</strong> </p> <p class="introduction2"> <strong> Passionné d'informatique</strong> </p> </div> <div class="border"> <br> <p class="compétences">COMPETENCES</p> <p class="langages">Langages</p><p class="frameworks">Frameworks</p><p class="logiciel">Logiciels</p><br><br><br> <p class="photoshop">P H O T O S H O P</p><br><br><img src="photoshop.png" width="40" alt="photoshop" class="logops"> <p class="illustrator">I L L U S T R A T O R</p><img src="illustrator.png" alt="illustrator" width="40" class="logoillustrator"> <p class="bootstrap">B O O T S T R A P</p><br><br><img src="bootstrap2.png" width="50" alt="bootstrap" class="logobootstrap"> <p class="symfony">S Y M F O N Y</p><img src="img synfony.png" width="45" alt="synfony" class="logosynfony"> <p class="html"> H T M L </p><img src="logo html.png" width="40" alt="logo HTML" class="logohtml"> <p class="CSS">C S S</p><img src="css3-logo.png" width="80" alt="logo css" class="logocss"> <p class="PHP"> P H P </p> <p class="MYSQL"> S Q L</p><img src="logo my sql.png" alt="logo sql" class="logosql"> </div> <div class="bbborder"><br> <p class="loisir ">LOISIRS </p> <img src="img montage.png" width="200" alt="img montage" class="imgmontage"> <img src="Escalade.png" width="200" alt=" img escalade" class="imgescalades"> <img src="img manette.png" alt="img manette" width="200" class="imgmanette"> <img src="chaise desingn.png" width="200" alt="chaise design" class="design"> <img src="img echec.png" width="200" alt="img echec" class="echec"> </div> <div class="bbbborder"><br> <p class="contact">CONTACT</p> <div class="conconcontact"> <section id="contact"> <div class="content"> <div id="form"> <form action="" id="contactForm" method="post"> <span class="sttrong">Name</span> <input type="text" name="name" class="name" placeholder="Nom" tabindex=1 /> <span class="sttrong">Email</span> <input type="text" name="email" class="email" placeholder="Email" tabindex=2 /> <span id="captcha"></span> <input type="text" name="captcha" class="captcha" size="4" placeholder="Sujet du message" tabindex=3 /> <span class="sttrong">Message</span> <textarea class="message" placeholder="Message" tabindex=4></textarea> <input type="submit" name="submit" value="Send e-mail" class="submit" tabindex=5> </form> </div> </section> </div> </div> </body> </html>
EDIT: Correction des balises de code ( langage HTML et non CSHARP )
jordane45
Messages postés
38167
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
7 mai 2024
4 657
23 févr. 2021 à 23:51
23 févr. 2021 à 23:51
Discussion déplacée dans le bon forum
jordane45
Messages postés
38167
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
7 mai 2024
4 657
23 févr. 2021 à 23:52
23 févr. 2021 à 23:52
Dans le code que tu nous montres je ne vois pas les includes de bootstrap...
Wanss
Messages postés
6
Date d'inscription
mardi 23 février 2021
Statut
Membre
Dernière intervention
24 février 2021
23 févr. 2021 à 23:54
23 févr. 2021 à 23:54
Voici mon code css
body{ background-color: rgb(116, 116, 116); } .bborder{ border:0.5em solid #313436 ; margin: 2em; background-color: #313436; } .intro{ font-size: 5em; color: white; margin-left: 1em; margin-top: 2em; } .introduction{ font-size: 3.5em; color: white; margin-bottom: 2em; margin-left: 2.5em; margin-top: -1em; } .introduction2{ font-size: 3em; color: white; margin-bottom: 2em; margin-left: 4em; margin-top: -1.5em; } .border{ border:0.5em solid #313436 ; margin: 2em; background-color: #313436; } .compétences{ font-size: 3em; color: white; text-align: center; margin-top: -0.1em; letter-spacing: 0.2em; } .html{ color:white; font-size: 1.5em; margin-left: 4.8em; margin-top: -8.3em; } .CSS{ color:white; font-size: 1.5em; margin-left: 5.4em; } .PHP{ color:white; font-size: 1.5em; margin-left: 5.5em; margin-top: -1em; } .langages{ margin-left:1.3em; font-size: 3em; margin-bottom: 1.5em; } .js{ color:#048b9a; font-size: 1.5em; margin-left: 2em; } .MYSQL{ color:white; font-size: 1.5em; margin-left: 5.5em; margin-top: 3em; } .frameworks{ text-align: center; font-size: 3em; margin-top: -2.6em; } .bootstrap{ text-align: center; color:white; font-size: 1.5em; margin-top: -8.3em; } .symfony{ text-align: center; color:white; font-size: 1.5em; } .logiciel{ margin-left: 15em; font-size: 3em; margin-top: -2.1em; } .photoshop{ margin-left: 30em; font-size:1.5em ; color:white; margin-top: -0.5em; } .illustrator{ margin-left: 30em; font-size:1.5em ; color:white; } .logohtml{ margin-bottom: 6em; margin-top: -6.5em; margin-left: 8.5em; } .logocss{ margin-bottom: 7em; margin-top: -7em; margin-left: 7.3em; } .logosql{ margin-left: 8.7em; margin-top: -8em; margin-bottom: 4.3em; } .loisir{ text-align: center; color: white; letter-spacing: 0.2em; font-size:3em ; margin-top: -0.1em; } .bbborder{ border:0.5em solid #313436 ; margin: 2em; background-color: #313436; } .logops{ margin-top: -10em; margin-bottom: 7em; margin-left: 49em; } .logobootstrap{ margin-top: -10em; margin-bottom: 7em; margin-left: 29em; } .logosynfony{ margin-top: -10em; margin-bottom: 4.7em; margin-left: 29em; } .logoillustrator{ margin-top: -10em; margin-bottom: 4.7em; margin-left: 49em; } .imgmontage{ margin-left: 6em; } .imgescalades{ margin-left: 5em; } .imgmanette{ margin-left: 5em; } .design{ margin-left: 14.5em; margin-bottom: 2em; margin-top: 1.5em; } .echec{ margin-left: 5.5em; margin-bottom: 2em; margin-top: 1.5em; } .bbbborder{ border:0.5em solid #313436 ; margin: 2em; background-color: #313436; } .contact{ letter-spacing: 0.2em; font-size: 3em; text-align: center; color: white; margin-top: -0.1em; } .concontact{ text-align: center; } #contact { overflow: auto; } #contact #form { width:410px; float:left; } #contact #form h2 { font: 48px 'Bree Serif', Georgia, serif; } #contact #form span { display:block; float:left; width:100px; padding-top:5px; font: 14px/16px'Bree Serif', Georgia, serif; } #contact #form input { float:left; width:255px; border:0px; color:#F1F1F1; padding:10px 10px 10px 30px; font: 11px/20px'Open Sans', Verdana, Helvetica, sans-serif; margin-bottom:10px; } #contact #form textarea { float:left; border:0px; width:255px; height:140px; padding:10px 10px 10px 30px; font: 11px/20px'Open Sans', Verdana, Helvetica, sans-serif; color:#F1F1F1; resize: none; } #contact #form input.name { background:#222222 url(http://img7.uploadhouse.com/fileuploads/17737/177370145f09fe433945815665aa214f80dbc6af.png) no-repeat 10px 8px; } #contact #form input.email { background:#222222 url(http://img6.uploadhouse.com/fileuploads/17737/177370138cc63992182149e9befabff3eafa6d23.png) no-repeat 10px 9px; } #contact #form input.captcha { background:#222222 url(http://img3.uploadhouse.com/fileuploads/17737/17737011310213e71805ecf2292144cbbecf42ad.png) no-repeat 10px 9px; } #contact #form textarea.message { background:#222222 url(http://img3.uploadhouse.com/fileuploads/17737/1773701229ed8c2f465a8274623ca8976adaf196.png) no-repeat 10px 8px; } #contact #form input.submit { cursor: pointer; width:85px; height:30px; float:right; padding:0px 0px 5px 0px; margin:10px 16px 0px 0px; background:#222222; color:#F1F1F1; font: 14px/16px'Bree Serif', Georgia, serif; text-align: center; } #contact #captcha span{ width: 44px; } #contact #captcha input{ background: url(http://img3.uploadhouse.com/fileuploads/17737/17737011310213e71805ecf2292144cbbecf42ad.png) no-repeat scroll 0 0 transparent; margin: 5px 0 0; padding: 0; border: medium none; cursor: pointer; width: 15px; } .conconcontact{ margin-left: 15.5em; } #from input.submit{ margin-top: 4em; } .sttrong{ color:#313436 ; }
Wanss
Messages postés
6
Date d'inscription
mardi 23 février 2021
Statut
Membre
Dernière intervention
24 février 2021
23 févr. 2021 à 23:59
23 févr. 2021 à 23:59
A oui je l'avais enlevé...
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="style.css"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous"> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.6.0/dist/umd/popper.min.js" integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.min.js" integrity="sha384-nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG" crossorigin="anonymous"></script> </head> <body> <div class="bborder"> <p class="intro"><strong>Bonjour,</strong> <p class="introduction"><strong>Je suis Noé</strong> </p> <p class="introduction2"> <strong> Passionné d'informatique</strong> </p> </div> <div class="border"> <br> <p class="compétences">COMPETENCES</p> <p class="langages">Langages</p><p class="frameworks">Frameworks</p><p class="logiciel">Logiciels</p><br><br><br> <p class="photoshop">P H O T O S H O P</p><br><br><img src="photoshop.png" width="40" alt="photoshop" class="logops"> <p class="illustrator">I L L U S T R A T O R</p><img src="illustrator.png" alt="illustrator" width="40" class="logoillustrator"> <p class="bootstrap">B O O T S T R A P</p><br><br><img src="bootstrap2.png" width="50" alt="bootstrap" class="logobootstrap"> <p class="symfony">S Y M F O N Y</p><img src="img synfony.png" width="45" alt="synfony" class="logosynfony"> <p class="html"> H T M L </p><img src="logo html.png" width="40" alt="logo HTML" class="logohtml"> <p class="CSS">C S S</p><img src="css3-logo.png" width="80" alt="logo css" class="logocss"> <p class="PHP"> P H P </p> <p class="MYSQL"> S Q L</p><img src="logo my sql.png" alt="logo sql" class="logosql"> </div> <div class="bbborder"><br> <p class="loisir ">LOISIRS </p> <img src="img montage.png" width="200" alt="img montage" class="imgmontage"> <img src="Escalade.png" width="200" alt=" img escalade" class="imgescalades"> <img src="img manette.png" alt="img manette" width="200" class="imgmanette"> <img src="chaise desingn.png" width="200" alt="chaise design" class="design"> <img src="img echec.png" width="200" alt="img echec" class="echec"> </div> <div class="bbbborder"><br> <p class="contact">CONTACT</p> <div class="conconcontact"> <section id="contact"> <div class="content"> <div id="form"> <form action="" id="contactForm" method="post"> <span class="sttrong">Name</span> <input type="text" name="name" class="name" placeholder="Nom" tabindex=1 /> <span class="sttrong">Email</span> <input type="text" name="email" class="email" placeholder="Email" tabindex=2 /> <span id="captcha"></span> <input type="text" name="captcha" class="captcha" size="4" placeholder="Sujet du message" tabindex=3 /> <span class="sttrong">Message</span> <textarea class="message" placeholder="Message" tabindex=4></textarea> <input type="submit" name="submit" value="Send e-mail" class="submit" tabindex=5> </form> </div> </section> </div> </div> </body> </html>
jordane45
Messages postés
38167
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
7 mai 2024
4 657
24 févr. 2021 à 00:01
24 févr. 2021 à 00:01
Alors, relis ma première réponse ..... tu dois charger ton css APRES celui de bootstrap !
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Wanss
Messages postés
6
Date d'inscription
mardi 23 février 2021
Statut
Membre
Dernière intervention
24 février 2021
24 févr. 2021 à 00:11
24 févr. 2021 à 00:11
Donc je dois mettre mon link css après celui de mon bootstrap c'est bien ça?
jordane45
Messages postés
38167
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
7 mai 2024
4 657
24 févr. 2021 à 00:12
24 févr. 2021 à 00:12
oui
Wanss
Messages postés
6
Date d'inscription
mardi 23 février 2021
Statut
Membre
Dernière intervention
24 février 2021
24 févr. 2021 à 00:16
24 févr. 2021 à 00:16
J'ai fait ce que tu as dis et sa a belle e bien marché je t'en remercie.
Bonne soirée.
Bonne soirée.