Wie kann ich dafür sorgen, dass sich ein Rasterelement über alle Zeilen/Spalten in einem impliziten CSS-Raster erstreckt?

Machen Sie, dass Rasterelemente in impliziten Rastern bis zu den letzten Zeilen/Spalten reichen

Problem: So überspannen Sie ein Rasterelement von der ersten bis zur letzten Zeile Zeile oder Spalte in einem impliziten Raster, wobei die Anzahl der Zeilen/Spalten angegeben ist unbekannt?

Hintergrund:

Implizite Raster sind Raster mit mehreren Spuren, die automatisch basierend auf dem darin enthaltenen Inhalt generiert werden. Ohne explizite Rasterdefinitionen wird es schwierig, die Anzahl der vorhandenen Zeilen/Spalten zu bestimmen.

Aktuelle Einschränkungen:

Leider ist dies innerhalb der aktuellen CSS-Grid-Spezifikation nicht der Fall Mithilfe von Rastereigenschaften ist es möglich, Rasterelemente über alle Zeilen/Spalten in einem impliziten Raster zu erstrecken allein.

Alternativen:

• Absolute Positionierung: Wie in einer anderen Antwort vorgeschlagen, können Sie mit der absoluten Positionierung die Position und Größe definieren eines Elements unabhängig vom Rasterlayout. Dieser Ansatz weicht jedoch vom gitterbasierten Ansatz ab.

Lösung für explizite Gitter:

Aufspannende Elemente können in impliziten Gittern zwar nicht erreicht werden, sind aber möglich um es explizit zu erreichen Gitter.

Negative Ganzzahlen verstehen:

Die CSS-Grid-Spezifikation ermöglicht die Verwendung negativer Ganzzahlen in Rasterplatzierungseigenschaften. Positive Ganzzahlen zählen vom Anfang an, während negative Ganzzahlen vom Ende an zählen.

Übergreifendes Rasterelement:

Um ein Rasterelement von der ersten bis zur letzten Spalte zu überspannen Verwenden Sie als explizites Raster Folgendes:

grid-column: 1 / -1;

Dies gibt an, dass das Rasterelement an der ersten Spaltenzeile beginnen und an der letzten Spaltenzeile enden soll. Das gleiche Konzept gilt für zeilenübergreifende.

Hinweis:

Diese Methode funktioniert nur, wenn das Raster explizit mithilfe von Rastervorlageneigenschaften (Zeilen, Spalten usw.) definiert ist Bereiche).

Das obige ist der detaillierte Inhalt vonWie kann ich dafür sorgen, dass sich ein Rasterelement über alle Zeilen/Spalten in einem impliziten CSS-Raster erstreckt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!