Warum sind meine Spalten in Bootstrap 4 nach dem Upgrade von Bootstrap 3 vertikal ausgerichtet?

Bootstrap 3 auf Bootstrap 4: Vertikal ausgerichtete Spalten

Beim Upgrade von Bootstrap 3 auf Bootstrap 4 kann es bei einigen Benutzern zu einem Problem kommen Spalten werden vertikal statt horizontal ausgerichtet.

Die Ursache:

Bootstrap 4 erfordert eine neue Zeile für verschachtelte Spalten. Die ältere Klasse col-12, die sich über die gesamte Zeile erstreckte, wird nicht mehr benötigt.

Die Lösung:

Um dieses Problem zu beheben, entfernen Sie die Klasse col-12 aus der übergeordneten Zeile.

Beispiel:

<div class="row">
    <div class="col-md-2">
        <h1 id="TEST">TEST</h1>
    </div>
    <div class="col-md-2">
        <h1 id="TEST">TEST</h1>
    </div>
    <div class="col-md-2">
        <h1 id="TEST">TEST</h1>
    </div>
    <div class="col-md-2">
        <h1 id="TEST">TEST</h1>
    </div>
</div>

Sehen Sie den Unterschied in dieser aktualisierten JS Fiddle:

https ://jsfiddle.net/aq9Laaew/4792/

Durch das Entfernen der col-12-Klasse werden die Spalten nun wie erwartet horizontal ausgerichtet.

Das obige ist der detaillierte Inhalt vonWarum sind meine Spalten in Bootstrap 4 nach dem Upgrade von Bootstrap 3 vertikal ausgerichtet?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!