fixe Colgroup in Firefox?
Max R.
- html
0 apsel0 Max R.
0 Vinzenz Mai
Hallo zusammen,
ich habe folgendes Problem, bei dem mir hoffentlich jemand weiterhelfen kann. Es geht darum, dass ich absolut fixe Zellenbreiten brauche. Wenn der Inhalt einer Zelle länger ist, soll er abgeschnitten werden. Gegeben ist folgender Style und folgende Tabelle:
<style>
.tableau{
white-space: nowrap;
overflow: hidden;
display:block;
}
</style>
<table border=0 class="tableau">
<colgroup>
<col style="width:150px" >
<col style="width:100px" >
<col style="width:150px" >
<col style="width:120px" >
<col style="width:120px" >
<col style="width:110px" >
</colgroup>
<tr>
<td>Spalte 1</td>
<td>Spalte 2</td>
<td>Spalte 3</td>
<td>Spalte 4</td>
<td>Spalte 5</td>
<td>Spalte 6</td>
</tr>
<tr>
<td>Spalte 1</td>
<td>Spalte 2</td>
<td>gaaaaaaaaaaaaaaaaaaaaaaaaaaaaanz langer Text</td>
<td>Spalte 4</td>
<td>Spalte 5</td>
<td>Spalte 6</td>
</tr>
[...]
Zeile n
[..]
</table>
Dies funktioniert im IE super, der Firefox schluckt dies leider so nicht.
Wenn ich aber nun folgendes probiere, geht es:
[...]
<td style="width:150px" />Spalte 1</td>
<td style="width:100px" />Spalte 2</td>
<td style="width:150px" />Texte, die länger als 150px sind werden jetzt abgeschnitten</td>
<td style="width:120px" />Spalte 4</td>
<td style="width:120px" />Spalte 5</td>
<td style="width:110px" />Spalte 6</td>
[...]
Kurzum: Ich will vermeiden, in jedes TD-Tag eine Breitenangabe (in Form eines Style- oder Classattributs) zu packen.
Kann mir jemand helfen?
Vielen Dank schonmal.
Gruß,
Max
Om nah hoo pez nyeetz, Max R.!
[code lang=html] <style> .tableau{ white-space: nowrap; overflow: hidden; display:block; }
td {width: 150px;} ?
</style>
Vermeide grundsätzlich inline-styles
Matthias
Hallo Matthias,
danke schon einmal für Deine Antwort. Auf diese Idee bin ich natürlich auch schon gekommen. Das Problem ist, dass die Spalten nicht alle gleich breit sein dürfen, weshalb ich mich für eine Colgroup entschieden habe.
Om nah hoo pez nyeetz, Max R.!
[code lang=html]
<style>
.tableau{
white-space: nowrap;
overflow: hidden;
display:block;
}td {width: 150px;} ?
</style>
Vermeide grundsätzlich inline-styles
Matthias
Om nah hoo pez nyeetz, Max R.!
Hallo Matthias,
danke schon einmal für Deine Antwort. Auf diese Idee bin ich natürlich auch schon gekommen. Das Problem ist, dass die Spalten nicht alle gleich breit sein dürfen, weshalb ich mich für eine Colgroup entschieden habe.
ja, hab ich auch grad gelesen, entschuldige das vorschnelle Posting.
Die Pseudoklasse nth-child sollte dein Freund sein.
Matthias
@@apsel:
nuqneH
Die Pseudoklasse nth-child sollte dein Freund sein.
Die ist aber nicht jedes Browsers Freund.
Es geht auch mit
td:first-child { … }
td:first-child+td { … }
td:first-child+td+td { … }
⋮
Wenn die erste Zelle jeder Zeile als das ausgezeichnet wurde, was sie üblicherweise ist – eine http://de.selfhtml.org/html/tabellen/aufbau.htm@title=Kopfzelle –, dann geht’s auch ohne :first-child
:
th { … }
th+td { … }
th+td+td { … }
⋮
(Ja, dass uralte Browser den Selektor für benachbarte Elemente nicht kennen, weiß ich. Ich wei auch, dass diese Browser nicht mehr unterstützt werden sollten.)
Qapla'
Hallo Max,
ich habe folgendes Problem, bei dem mir hoffentlich jemand weiterhelfen kann. Es geht darum, dass ich absolut fixe Zellenbreiten brauche. Wenn der Inhalt einer Zelle länger ist, soll er abgeschnitten werden. Gegeben ist folgender Style und folgende Tabelle:
<style>
.tableau{
white-space: nowrap;
overflow: hidden;
display:block;
}
wenn Du fixe Zellenbreiten und browserübergreifendes Verhalten wünschst, so ist dies recht einfach umzusetzen, indem Du den dafür vorgesehenen Rendermodus für Tabellen verwendest:
[code lang=css]table-layout: fixed;
siehe [SELFHTML-Wiki](http://wiki.selfhtml.org/wiki/Referenzen:CSS/Eigenschaftenreferenz/Tabellenformatierung#Fixe.2Fvariable_Breiten).
Dazu ist es nach [meinen Tests](/archiv/2008/9/t176589/#m1162551) unbedingt erforderlich, auch für die Tabelle eine Breite anzugeben, die maximal so groß ist wie die Summe der Spaltenbreiten.
Freundliche Grüße
Vinzenz