nicht angemeldet
Problem 100% height
Gunnar BittersmannHallo Leute,
wieder mal ein Problem mit css:
http://dantao.digitalearbeit.de/
height: 100% scheint unmöglich zu sein..
Was am merkwürdigsten ist:
Im IE funzt es, wo es doch da sonst nicht so einfach gehen soll.
Ich denke, ich habe eigentlich alle Regeln für dieses Problem befolgt.
Trotzdem wird bei der Seite das alles umschließende #frame div nicht bis zum Ende des Contents gestreckt, sondern interpretiert immer nur die ursprüngliche Länge des Browserfensters als 100%.
Weiß jemand Rat?
gruß
-
Hallo,
mit Deinem CSS-Angaben sagst Du korrekt arbeitenden Browsern "100% des Browserfensters". Wenn Du aber "100% + X" meinst, dann mußt Du denen das auch sagen: min-height:100%.
Was am merkwürdigsten ist:
Im IE funzt es, wo es doch da sonst nicht so einfach gehen soll.
Der IE mißinterpretiert height als min-height.
Viele Grüße
Carsten -
Hi bossy22,
Wie der geänderte Themenbereich vermuten lässt nichts zu deinem CSS-Problem.Wenn du XHTML schreibst musst du dich auch dessen Regeln richten und die Unterschiede zwischen XHTML und HTML beachten.
Bspw. fehlt dem
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15">das Ende.Und die Primärsprache solltest du auch noch mit
<meta http-equiv="Content-Language" content="de" />angeben. [HTML-TECH-LANG]Ein auftretendes & muss immer maskiert sein, auch in einem URI. [XHTML1 §C12]
Viele der Fehler sind Folgefehler wegen unerlaubter Elemente wie SCRIPT.
Live long and prosper,
GunnarPS. Der Quelltext war aber doch mal eine Wohltat für die Augen. ;-)
--
„Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)-
@Gunnar:
du meinst also, die Probleme sind struktureller Natur im XHTML?
Ok, das werde ich checken.@Carsten:
min-height etc, habe ich schon alles probiert, daran liegts nicht..
Gruß
bossy
-
Hallo,
min-height etc, habe ich schon alles probiert, daran liegts nicht..
Ich hab' nochmal genauer nachgeschaut: Du hast noch ein weiteres Problem, bei dem der IE es zwar wie "gewünscht" darstellt, es aber leider falsch darstellt (das Problem ist schon ein "Klassiker" bei Verwendung von float):
Dein Frame-Div ist der Container von mehreren gefloateten Elementen. Diese Elemente werden durch das Float aus dem normalen Fluß genommen und beeinflussen *nicht mehr* die Größe von ihrem Elternelement, also dem Frame-Div. D.h. das Frame-Div wird so hoch, wie Du es im CSS angegeben hast: 100% (in Deinem Fall also Browserfensterhöhe). Ein min-height bewirkt hier natürlich nichts, da es keinen Grund gibt, es größer als 100% zu machen.
Es gibt mehrere Lösungen für dieses Problem: Der etwas unsaubere Klassiker wäre, als letztes Element innerhalb des Frame-Divs nicht floatenden Inhalt einzufügen. Eleganter, da ohne unnötiges Markup, geht es hiermit: http://www.positioniseverything.net/easyclearing.html. Am allereinfachsten geht es in Deinem Beispiel aber, indem Du einfach Deinem Frame-Div selbst noch ein float:left verpaßt.
Nichtsdestotrotz mußt Du aber das height:100% für das Frame-Div loswerden, weil es sonst in Firefox und Co. nach wie vor auf Browserfensterhöhe bleibt.
Ein letztes Problem bleibt noch: Die Textblöcke Deines Contents sind im Firefox etwas schmaler als im IE oder in Opera (warum weiß ich grad nicht, hab aber auch nicht weiter geschaut), weswegen Dein Inhalt im Firefox etwas länger ist als in den anderen Browsern. Daher wird der Inhalt nun länger als Dein Toolbar-Div, es gibt unterhalb des Toolbar-Divs einen weißen Streifen.
Viele Grüße
Carsten
-
-