kleines Blockgitter zentriert die Daumen nicht richtig

Question

ich habe 3 Daumen, die ich in einer Reihe zentrieren möchte.Der Code ist

    <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>

Aber irgendwie fangen die Daumen von links an und nicht in der Mitte.können Sie vorschlagen, wie Sie das beheben können.hier ist das Bild

Hier ist der Link VERKNÜPFEN

Sie können sehen, dass die Daumen nach links schweben.wie man sie zentriert.Danke.

Answer 1

Ersetzen Sie eine Zeile mit folgenden

generasacodicetagpre.

-Taste ist das Hinzufügen von style="text-align: center;" und ein Problem wird behoben

Answer 2

Danke für das Posten der URL.

Fügen Sie einfach hinzu text-align:center; in Ihrem .small-block-grid-3 > li{}

Bitte lassen Sie es mich wissen, wenn Sie Bedenken haben.

CSS

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

Answer 3

Fügen Sie dieses CSS zu Ihren Bild-Tags hinzu:

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

Es wird das Bild an ausrichten center präsent in li Tag.

Answer 4

ist möglicherweise schön zu wissen, dass diese Stiftung auch eine CSS-Klasse namens "Textcenter" hat, die nach Bedarf auf Elemente angewendet werden kann: -)

generasacodicetagpre.