Heim > Web-Frontend > CSS-Tutorial > Warum werden meine Spalten nach der Migration auf Bootstrap 4 nicht richtig ausgerichtet?

Warum werden meine Spalten nach der Migration auf Bootstrap 4 nicht richtig ausgerichtet?

Linda Hamilton
Freigeben: 2024-11-16 04:39:03
Original
722 Leute haben es durchsucht

Why Are My Columns Not Aligning Properly After Migrating to Bootstrap 4?

Problem mit der horizontalen Ausrichtung bei der Bootstrap-Migration von 3 auf 4

Beim Übergang von Bootstrap 3 auf 4 können Benutzer auf ein Problem mit der vertikalen Ausrichtung stoßen für Spalten. Um dieses Problem zu beheben, müssen unbedingt die in Bootstrap 4 eingeführten Verschachtelungsänderungen berücksichtigt werden.

Zuvor konnten in Bootstrap 3 verschachtelte Spalten innerhalb einer Spalte mit derselben Spaltenklasse (z. B. col-12) platziert werden. In Bootstrap 4 erfordert die Verschachtelung jedoch eine neue Zeile für jede Verschachtelungsebene. Diese Änderung beseitigt das Problem der zentrierten Ausrichtung und stellt eine ordnungsgemäße horizontale Ausrichtung sicher.

Der aktualisierte Code folgt dem überarbeiteten Verschachtelungsansatz:

<div class="row">
    <div class="col-md-2">
        <h1>TEST</h1>
    </div>
    <div class="col-md-2">
        <h1>TEST</h1>
    </div>
    <div class="col-md-2">
        <h1>TEST</h1>
    </div>
    <div class="col-md-2">
        <h1>TEST</h1>
    </div>
</div>
Nach dem Login kopieren

In diesem aktualisierten Code wurde die Verschachtelung entfernt und jede Spalte wird in einer eigenen Zeile platziert. Durch die Einhaltung der empfohlenen Verschachtelungsrichtlinien wird die horizontale Ausrichtung wiederhergestellt und eine ordnungsgemäße visuelle Darstellung gewährleistet.

Das obige ist der detaillierte Inhalt vonWarum werden meine Spalten nach der Migration auf Bootstrap 4 nicht richtig ausgerichtet?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage