CSS - Wrapping-Priorität

8

Ich habe eine Tabelle mit 3 Spalten

%Vor%

Was passiert ist, dass die letzte Spalte zuerst ihren Inhalt und dann die Beschreibungsspalte umschließt. Ich möchte, dass die Spalte "Beschreibung" zuerst umbrochen wird. Ich habe versucht, white-space: nowrap hinzuzufügen, aber dann wird die Spalte Actions nie umbrochen.

Wie entscheidet der Browser, welche Spalte umbrochen werden soll?

Ich möchte, dass die Spalte 3 die letzte ist, die umbrochen wird. Bis die Spalte Beschreibung vollständig umbrochen ist, sollten die Schaltflächen in einer einzelnen Zeile angezeigt werden. Wenn kein Platz mehr vorhanden ist, kann die Spalte umbrochen werden.

%Vor% %Vor%
    
algiogia 17.04.2015, 14:43
quelle

3 Antworten

3

Spalten umschließen ihren Text in absteigender Reihenfolge in einer Tabelle. Sie müssen also nur die Breite der letzten Spalte korrigieren.

Wenn Sie möchten, dass es erneut in kleinen Bildschirmen angezeigt wird, fügen Sie einfach eine Medienabfrage hinzu (siehe CSS), um die Breite auf auto zurückzusetzen und der Spalte die Priorität zu geben, die sie umbrechen soll.

%Vor% %Vor%
    
Bassem El Hachem 17.04.2015, 15:10
quelle
3

Geben Sie der ersten und letzten Spalte eine Breite. Das zentrale Layout wird dann das gesamte restliche Layout übernehmen und bei Bedarf den Inhalt umschließen.

    
tribe84 17.04.2015 14:47
quelle
3

Siehe den Abschnitt Automatisches Tabellenlayout in der Spezifikation:

  

Spaltenbreiten werden wie folgt bestimmt:

     
  1. Berechnen Sie die minimale Inhaltsbreite (MCW) jeder Zelle: Der formatierte Inhalt kann eine beliebige Anzahl von Zeilen umfassen, darf jedoch nicht überlaufen   die Zellenbox. Wenn die angegebene "Breite" (W) der Zelle größer ist   als MCW ist W die minimale Zellenbreite. Ein Wert von "auto" bedeutet das   MCW ist die minimale Zellenbreite.

  2.   
  3. Berechnen Sie auch die "maximale" Zellenbreite jeder Zelle: formatieren Sie den Inhalt, ohne die Zeilen zu trennen, außer an der expliziten Zeile   Pausen auftreten.

  4.   
  5. Ermitteln Sie für jede Spalte eine maximale und minimale Spaltenbreite aus den Zellen, die nur diese Spalte umfassen. Das Minimum ist das von   die Zelle mit der größten minimalen Zellenbreite (oder die Spalte    'Breite' , je nachdem, welcher Wert größer ist). Das Maximum ist das, was von benötigt wird   die Zelle mit der größten maximalen Zellenbreite (oder die Spalte    'Breite' , je nachdem, welcher Wert größer ist.

  6.   
  7. Erhöhen Sie für jede Zelle, die sich über mehr als eine Spalte erstreckt, die Mindestbreite der Spalten, die sie überspannt, so dass sie mindestens gleich sind   breit wie die Zelle. Machen Sie dasselbe für die maximalen Breiten. Wenn möglich,   Erweitern Sie alle überspannten Spalten um ungefähr den gleichen Betrag.

  8.   
  9. Erhöhen Sie für jedes Spaltengruppenelement mit einer anderen "Breite" als "auto" die Mindestbreite der Spalten, die es umfasst, zusammen   Sie sind mindestens so breit wie die Spaltenbreite der Spaltengruppe.

  10.   

Dies gibt eine maximale und minimale Breite für jede Spalte.

     

Das Minimum der Untertitelbreite (CAPMIN) wird durch Berechnung von bestimmt   jeder Titel die minimale Untertitelbreite als MCW von a   hypothetische Tabellenzelle, die die als formatierte Überschrift enthält   "Bildschirmsperre". Die größte der minimalen Untertitelbreiten ist   CAPMIN.

     

Spalten- und Beschriftungsbreiten beeinflussen die endgültige Tabellenbreite wie folgt:

     
  1. Wenn das Element 'table' oder 'inline-table' 'width' ist Eigenschaft hat einen berechneten Wert (W) anders als 'auto', die verwendete Breite ist die   größer von W, CAPMIN und die minimale Breite, die von allen benötigt wird   Spalten plus Zellenabstand oder Rahmen (MIN). Wenn die verwendete Breite ist   größer als MIN, sollte die zusätzliche Breite über die verteilt werden   Spalten.
  2.   
  3. Wenn das Element 'table' oder 'inline-table' 'width: auto' hat, ist die verwendete Breite die größere der Blockbreite der Tabelle,   CAPMIN und MIN. Wenn jedoch entweder CAPMIN oder die maximale Breite   von den Spalten plus Zellabstand oder Grenzen (MAX) erforderlich ist weniger   Als die des umschließenden Blocks, verwenden Sie max (MAX, CAPMIN).
  4.   

Beachten Sie

  

Wenn die verwendete Breite größer als MIN ist, sollte die zusätzliche Breite sein   über die Spalten verteilt.

Es spezifiziert jedoch nicht, wie es verteilt werden sollte.

Außerdem ist der Algorithmus nicht normativ:

  

Dieser Algorithmus spiegelt das Verhalten einiger bekannter HTML-Benutzer wider   Agenten beim Schreiben dieser Spezifikation. UAs müssen nicht   Implementieren Sie diesen Algorithmus.

Daher ist das Verhalten implementierungsabhängig .

    
Oriol 17.04.2015 15:13
quelle

Tags und Links