✔ Text geht über den Tabellenrand hinaus

D

diogenuss

Mitglied
Hallo Forum und frohe Ostern,

vermutlich ein Mini-Fehler, aber ich stehe auf der Leitung und finde ihn nicht:
Ich habe in einem <div> eine Tabelle angelegt, in dieser Tabelle eine Zelle,
die mit Text/Bild gefüllt wird. Dieser Zelle wurde eine eindeutige Grösse zugewiesen.
Aber in der Höhe, am unteren Rand, verlängert sich die Zelle nun einfach,
sobald ich einen Blindtext hineinschreibe, der länger ist.

Zu sehen hier

Die blöde Zelle verlängert sich einfach. Das soll sie nicht dürfen... .

Liebe Grüsse vom leicht verwirrten

don dio del disco duro:confused:
 
Hi,

jedes deiner 4 übergeordneten, die Tabelle umschliessenden <div>-Elemente besitzt im CSS eine absolute / feste Höhenangabe.

Noch Fragen, warum der Text in der, oder auch die Tabelle selber, dagegen nicht ankommt? :-)

Nutze in diesem Fall für die standardkonformen Browser stattdessen die min-height-Eigenschaft, die eine Box bei zunehmenden Inhalt mitwachsen lässt, und übergib die height-Angaben, wenn erforderlich, getrennt von diesen Browsern den älteren IE-Versionen (5.x, 6), die wiederum min-height nicht kennen, aber dafür zum Ersatz diese Eigenschaft als "Mindesthöhe" einer Box (miß)interpretieren.

mfg Maik
 
...das habe ich jetzt nicht verstanden.
Oder mich vorher falsch ausgedrückt?!
Ich möchte ja eine _maximale_ Höhe definieren,
damit der Text ebendort aufhört, wo ich mir das vorstelle.
min-height definiert doch die minimale Höhe.

Mein umfliessendes <div> hat dafür eine zu hohe Höhe.
Wenn ich sie verkleinere, erhalte ich den gewünschten Effekt ebensowenig.

Oder könnte ich drei <divs> eventuell hintereinanderlegen, eines oben, eines in der Mitte (das dann den Textinput erhält) und eines unten,
um so sicher zu sein, dass sich der Text in der Mitte meines Kastens aufhält?

Trotz der kurzen Verwirrung einmal mehr vielen Dank für so schnelle Antwort!

don dio
 
Wenn der übergroße Inhalt nicht über den unteren Boxenrand (sichtbar) hinauslaufen soll, steht dir die overflow-Eigenschaft zur Verfügung, um für den umschliessenden DIV-Block eine Regel festzulegen, wie der Browser im Konfliktfall damit umgehen soll - entweder overflow:auto (entspricht overflow:scroll), um darin den Inhalt zu scrollen, oder overflow:hidden, damit sein Überfluß abgeschnitten wird.

Mit deinen Höhenangaben alleine gibt sich kein Browser zufrieden, den übergroßen Inhalt unten aus der Box nicht überlaufen zu lassen, wie es bei dir, am Ellipsenbogen deutlich erkennbar, der Fall ist.

mfg Maik
 
Das hatte ich nicht für möglich gehalten, dass den Browsern solche eindeutigen Definitionen nicht ausreichen.
Gibt es dafür eigentlich einen guten Grund?

Ich meine... wofür definiert man das denn sonst? ;-)

Vielen Dank für die guten Tipps, mit "overflow: hidden" habe ich zunächst mal erreicht, was ich wollte...

:-) btw. ich vermisse hier im Forum ein smiley, mit dem man sich verbeugen oder den Hut ziehen kann!
Nun, dies also auch ohne emoticon an Dich!

don dio
 
Die height-Eigenschaft legt "lediglich" die Höhe eines HTML-Elements fest. Wie sich das Element verhalten soll, wenn sein Inhalt die vorgegebene Höhe überschreitet, regelt die overflow-Eigenschaft.

mfg Maik
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück