kleines Blockgitter zentriert die Daumen nicht richtig
-
21-12-2019 - |
Frage
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.
Lösung
Ersetzen Sie eine Zeile mit folgenden
generasacodicetagpre. -Taste ist das Hinzufügen von style="text-align: center;"
und ein Problem wird behoben
Andere Tipps
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;
}
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.
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.