Zentrieren von Text in einer div-Spalte - zurb-foundation

Ich benutze den Rahmen der Zurb Foundation und versuche Text zu zentrieren.

Wenn ich nur das benutze .text-center Klasse:

<h1 class="text-center">My Heading</h1> Der Text ist in der Mitte.

Wenn ich es jedoch innerhalb einer Spalte platziere, wird der Text leicht nach rechts verschoben:

<div class="row">
<div class="small-2 small-centered columns text-center">
<h1>My Heading</h1>
</div>
</div>

Ich möchte fragen, wie man den Text innerhalb von Spalten richtig zentriert?

Antworten:

1 für die Antwort № 1

Es sollte gut mit Ihrem Code funktionieren, aber wenn Sie einen Screenshot zur Verfügung stellen können, um zu sehen, was Sie mit seiner Bewegung nach rechts meinen, wird es nett sein.

Überprüfen Sie trotzdem, ob diese Lösung funktioniert, und das Problem könnte von zusätzlichen benutzerdefinierten CSS hinzugefügt werden, wenn Sie eine haben.

CSS:

  .row h1 { margin: 0 auto; padding : 0px }

Versuche dies Geige


0 für die Antwort № 2

Das Problem war, dass das Wort innerhalb der Überschrift für mein mobiles Gerät zu lang ist. Daher habe ich die style -Eigenschaft hinzugefügt:

word-wrap: break-word;

Nicht sicher, ob dies der richtige Weg ist, um solche Fälle zu behandeln, aber es ist eine mögliche Lösung.


Am beliebtesten