Bootstrap : prblm colonne qui occupe toute la row

Sujet résolu

16 juillet 2019 à 11:29:44

Bonjour à tous,

je suis débutant en front et j'essaye de commencer avec Bootstrap.

Lorsque j'essaye de créer deux colonnes de taille 6, les deux colonnes s'empilent l'une sur l'autre... Impossible de les avoir les deux côtes à côtés.

Voici mon code html:

<!doctype html>
<html lang="fr">

<head>
  {%load static%}
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <title>My containers</title>
</head>
<body>
  {%load static%}
  <link rel="stylesheet" href="{%static "css/style.css"%}" />
  <div class="container">
    <div class="row">
      <div class="col-lg-6">
        <p>container 1</p>
      </div>
      <div class="col-lg-6">
        <h1>container 2</h1>
      </div>
    </div>
  </div>
</body>
</html>

et mon css :

[class*="col-"], footer {
  background-color: lightyellow;
}

c'est un code très simple mais je ne comprends pas pourquoi cela ne marche pas. Je précise que j'arrive à changer l'apparence des colonnes. Le seul problème est que je ne peux pas faire de mise en page...

Merci d'avance

tomlahaye

16 juillet 2019 à 11:33:37

bonjour, essayer avec un col-md-6 peut être.

Apprenti Technicien Informatique

wourkout

16 juillet 2019 à 11:35:43

Toujours pas, de plus, je travaille bien sur un écran d'ordinateur qui fonctionne normalement avec col-lg ...

Mewen_bzh

16 juillet 2019 à 11:42:03

Salut,

Je ne vois pas le lien vers le CDN de Bootstrap dans le head de ta page.

Il y a effectivement un lien vers la min du js de Bootstrap mais pas vers le CSS. Est-tu certain que ce dernier est bien inclus ?

Je ne réponds pas aux messages privés.

wourkout

16 juillet 2019 à 11:47:54

En effet... erreur d'inattention.

Merci beaucoup