113 votes

Centrer le contenu à l'intérieur d'une colonne dans Bootstrap 4

J'ai besoin d'aide pour résoudre le problème, j'ai besoin de centrer le contenu à l'intérieur de la colonne dans bootstrap4, s'il vous plaît trouver mon code ci-dessous

<div class="container">
    <div class="row justify-content-center">
        <div class="col-3">
        <div class="nauk-info-connections">
        </div>
     </div>
</div>

3 votes

Utiliser peut utiliser class="text-center" .

0 votes

J'ai essayé de l'utiliser mais cela ne fonctionne pas pour Bootstrap4, le texte seul est centré mais j'ai besoin que le div avec la classe "nauk-info-connections" lui-même soit centré aligné à l'intérieur du div col-3.

0 votes

J'ai utilisé la méthode traditionnelle de centrage du conteneur .nauk-info-connections{ border-radius:50% ; border:1px solid $nauk-orange ; height : 100px ; width : 100px ; margin : 0 auto ; }

2voto

user5783745 Points 1214

Réponse très simple en bootstrap 4 changez ceci

<row>
  ...
</row>

à ce

<row class="justify-content-center">
  ...
</row>

1voto

Abdo Host Points 9
.row>.col, .row>[class^=col-] {
    padding-top: .75rem;
    padding-bottom: .75rem;
    background-color: rgba(86,61,124,.15);
    border: 1px solid rgba(86,61,124,.2);
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
  <div class="row justify-content-md-center">
    <div class="col col-lg-2">
      1 of 3
    </div>
    <div class="col col-lg-2">
      1 of 2
    </div>
    <div class="col col-lg-2">
      3 of 3
    </div>
  </div>
</div>

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X