J'ai utilisé la classe Col donnée par Bootstrap afin de rendre mon site réactif, mais les colonnes ne fonctionnent pas et agissent en tant que lignes. J'ai utilisé la méthode des colonnes deux fois avant et elle fonctionnait toujours
J'ai déjà recherchée sur le Web mais je n'ai pas trouvé de réponse de travail p>
Voici mon code HTML: p>
P>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container h85" id="journalier">journalier
<div class="row">
<div class="col-lg-1">1</div>
<div class="col-lg-4" id="repas-journalier">5</div>
<div class="col-lg-2" id="star">7</div>
<div class="col-lg-4" id="sport-journalier">11</div>
<div class="col-lg-1">12</div>
</div>
</div>4 Réponses :
Je doute que vous importeriez BootsTrap.css le mauvais moyen, vous pouvez vérifier le chemin à nouveau.
mais voici la solution rapide: p>
.row{
border-bottom: solid 2px black;
border-top: solid 2px black;
margin: 2vh;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: cennter;
flex-wrap: unset;
}
Je pense que vous devez utiliser tous les points d'arrêt.
Essayez pour les résolutions moyennes: alors vous devez ajouter col-lg-1 col- MD-1 col-sm-1 ou col-1 pour tous les points d'arrêt si vous utilisez Bootstrap 4. 
Dans la capture d'écran, j'ai utilisé une autre URL pour la bootstrap 4 ... essayer avec votre URL StackPath.bootstrapcdn.com/bootstrap/4.2.1/css/.../a> fonctionne très bien à.
Votre code semble fonctionner, mais le point d'arrêt des colonnes ne sera appliqué que pour les écrans d'au moins 1200px, car vous utilisez COL-LG-. Pour référence:
bootstrap 4
Extra Petit (Col-) <576PX
Petit (col-sm-) ≥ 576px de
Moyen (col-MD-) ≥ 768px de
Grand (col-lg-) ≥ 992px de
Extra GRAND (COL-XS-) ≥ 1200PX
bootstrap 3
Extra Petit (Col-XS-) <768PX
Petits appareils (Col-Sm-) ≥ 768px
Dispositifs moyens (COL-MD-) ≥ 992PX de
Grands appareils (COL-LG-) ≥ 1200PX
Essayez ceci:
p>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css">
<link rel="stylesheet" href="accueil.css">
<div class="container h85" id="journalier">journalier
<div class="row">
<div class="col-lg-1">1</div>
<div class="col-lg-4" id="repas-journalier">5</div>
<div class="col-lg-2" id="star">7</div>
<div class="col-lg-4" id="sport-journalier">11</div>
<div class="col-lg-1">12</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
Quelle version de bootstrap utilisez-vous? Je vous suggère de lire The Bootstrap Docs à propos de le système de grille
Lorsque j'exécute votre code de code et cliquez sur le lien intégral de la page, puis il s'affiche comme prévu.