petit bloc de la grille de ne pas centrage pouces correctement

Question

j'ai 3 pouces, je veux de centre dans une rangée.Le code est

    <div class="large-12 columns">
    <ul class="small-block-grid-3">
      <li><img class="shadow" src="img/thumbs/carWashHome.jpg"></li>
      <li><img   class="shadow" src="img/thumbs/homeCleanHome.jpg"></li>
      <li><img   class="shadow" src="img/thumbs/carpetCleanHome.jpg"></li>
    </ul>
  </div>

Mais de toute façon les pouces sont a partir de la gauche et non au centre.pouvez-vous suggérer d'être la façon de corriger l'erreur.voici la photo

Voici le lien LIEN

Vous pouvez voir que les pouces sont flottait à gauche.comment faire pour centrer.merci.

Answer 1

Remplacer la ligne suivante

<div class="large-12 columns" style="text-align: center;">

La clé est d'ajouter style="text-align: center;" et le problème sera résolu

Answer 2

Merci pour l'affichage de l'URL.

Ajoutez simplement text-align:center; dans votre .small-block-grid-3 > li{}

S'il vous plaît laissez-moi savoir si vous avez des préoccupations.

CSS

.small-block-grid-3 > li{
    text-align:center;
}

Answer 3

Ajouter cette css à votre image tags:

display: block;
margin-left: auto;
margin-right: auto;

Il va aligner l'image à center présent dans li la balise.

Answer 4

Peut être agréable à savoir, cette fondation dispose également d'une classe CSS appelée "Text-Center" qui peut être appliquée aux éléments au besoin: -)

<div class="text-center">
content goes here...
</div>