Ich habe im folgenden Stil geschrieben:
%Vor%und ich sehe keine Übersteuerungen in Firebug. Trotzdem wird die Tabellenbreite als 812 px berechnet;
Warum?
Aktuelle Seite ist hier (in Russisch): Ссылка
AKTUALISIEREN
Kann ich unsichtbare Wortumbrüche hinzufügen, die zu Wortumbruch und Bindestrich führen würden, wenn nicht genügend Platz und fortlaufendes Wort vorhanden wäre, wenn genügend Platz vorhanden wäre?
Die Breiteneinstellung wird nicht ignoriert; es wird nur überschrieben, durch die minimalen Anforderungen von Zellinhalten. In jeder Spalte bestimmt das längste Wort die kleinstmögliche Breite. Dies entspricht den CSS-Spezifikationen: Für eine Tabelle ist die Eigenschaft width
standardmäßig nur eine vorgeschlagene Mindestbreite.
"Kleinstmöglich" ist jedoch relativ. Sie können die Worttrennung auf verschiedene Arten aktivieren. Aber um zu sehen, wohin das führt, können Sie testen, indem Sie das <html>
-Tag in <html lang=ru>
ändern und die Regel * { -moz-hyphens: auto }
zu Ihrem CSS hinzufügen und die Seite in Firefox testen. Sie sehen, dass die Tabelle so formatiert ist, dass die Wörter getrennt sind und die Breite der deklarierten Breite so nahe kommt, wie Sie es erhalten. Es sieht ziemlich schrecklich aus. Die angegebene Breite ist einfach zu klein für den Inhalt.
Alternativ versuchen Sie, table { table-layout: fixed }
in CSS zu setzen. Dies wird die Breite verstärken, egal was passiert. Und dadurch wird der Zellinhalt aus den Zellen überlaufen. Ich denke nicht, dass dir das auch gefallen wird.
Ich würde also vorschlagen, dass Sie nicht versuchen, eine so geringe Breite zu erzwingen, sondern die Breite ganz zu entfernen und die Silbentrennung zu aktivieren. Das Ergebnis sieht relativ gut aus. Für die Silbentrennung würde ich vorschlagen, Hyphenator.js zu verwenden, einen JavaScript-basierten Ansatz, der Browser-übergreifend funktioniert; Der CSS-basierte Ansatz hat immer noch eine eingeschränkte Browserunterstützung.
Dies liegt daran, dass in der Tabelle Wörter enthalten sind, die standardmäßig nicht umgebrochen werden können. Daher kann die Tabelle nicht verkleinert werden. Der Effekt wird auftreten:
%Vor% Wenn Sie font-size
auf 1px
setzen, sehen Sie, dass die Breite genau 400 Pixel beträgt.
Allerdings kann in CSS3 die CSS-Eigenschaft word-break
damit umgehen.
Sie können eine Tabelle nicht zu klein für ihren Inhalt machen. Sie könnten versuchen, die Schriftgröße zu reduzieren oder ein anderes Layout auszuprobieren (z. B. weniger Spalten verwenden).
In Bezug auf Ihre aktualisierte Frage: Ja, Sie können unsichtbare Wortumbrüche hinzufügen (hier ein Beispiel: Wie man Leerzeichen für Opera Browser umschließt ), aber das ist wirklich ein letzter Ausweg.
Tags und Links html css width css-tables