Cours prenez en main bootstrap

Problème affichage chapitre 2, les grilles

Sujet résolu

Anonyme

4 juin 2018 à 2:30:41

Salut tout le monde, c'est michelD225 j'ai un soucis concernant le cours PRENEZ EN MAIN BOOTSTRAP à l'étape 2 où il est question d'avoir ce rendu (déclarer une seule rangée avec deux éléments qui occupent tout l'espace)

Mais mon navigateur affiche :

Voici le code css :

body {
  padding-top: 10px;
}
[class*="col-"], footer {
  background-color: lightgreen;
  border: 2px solid black;
  border-radius: 6px;
  line-height: 40px;
  text-align: center;
}

.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 768px) {
  .container {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1170px;
  }
}

html

<!DOCTYPE html>
<html>
  <head>
    <link href="assets/css/bootstrap.css" rel="stylesheet">
    <link href="assets/css/tuto.css" rel="stylesheet">
  </head>
  <body>
    <div class="container">
      <div class="row">
        <div class="col-lg-4">4 colonnes</div>
        <div class="col-lg-8">8 colonnes</div>
      </div>
    </div>
  </body>
</html>

Merci, attends vos réponses.

Ruynix

4 juin 2018 à 8:52:48

Bonjour,

.row {
     display: flex;
}

Lamecarlate

4 juin 2018 à 9:24:36

Bonjour,

le code proposé par Ruynix concerne Bootstrap 4 - et est de toute façon déjà dans le framework, il ne faudrait pas l'ajouter.

Par contre, mettons-nous bien d'accord sur la version de BS à prendre : le cours parle de la version 3, est-ce bien celle-là que tu as téléchargé ?

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

Anonyme

4 juin 2018 à 23:42:04

Non c'est la version 4 que j'utilise

Lamecarlate

5 juin 2018 à 7:58:38

Bon, même s'il serait mieux d'utiliser la 4, prends bien celle qui est demandée dans le cours : la 3.3 (voir https://openclassrooms.com/courses/prenez-en-main-bootstrap ).

Et vérifie que les fichiers css et js de BS sont bien chargés sur ta page.

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

Anonyme

6 juin 2018 à 2:21:44

ok merci bcp