• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

(mal wieder) ein div Problem (100% höhe)

  • Ersteller Ersteller dementia
  • Erstellt am Erstellt am
Status
Für weitere Antworten geschlossen.
D

dementia

Guest
Nunja für die CDU Fraktion in unserem Kaff mach ich gerade eine HP.

Am besten schaut ihr euch das ganze mal hier an.

Im Firefox funktioniert alles wunderbar, aber im IE bekomme ich die Navi und den Content einfach nicht 100% hoch.. Woran liegt das? Bei meinem alten dementia Layout habe ich eigentlich fast den selben Code für 100% genommen und da hat es funktioniert :?

Hoffe ihr könnt mir helfen.

//edit für alle nicht-ie-haber hier ein screen.

//edit² nicht meckern ich mag die cdu auch nich :P
 
Hi dementia

als erstes solltest du einen schließenden DIV-Tag für den Container hinzufügen der fehlt. Auch ein Doctype könnte nichts schaden weil der IE sonst im Quirks-Modus arbeitet, was sich negativ auf die Darstellung auswirken kann.

Gruß
Hobbyuser
 
Danke, aber das Problem besteht weiterhin.
Kann man im IE eigentlich irgendwo sehen, in welchem Modus die Seite interpretiert wird?

mfg

//edit jetzt versteh ich garnichts mehr.. auch im ff ist es nicht 100% hoch :(
 
Ich noch mal

bezüglich der Browser hab ich mal irgendwo eine Übersicht gefunden, wo und ob man das im Browser weiß ich leider auch nicht.

Zu deinem Höhenproblem solltest du mal bei CSS4You gucken, dort wird für HTML auch eine höhe von 100% angegeben.
LINK: http://www.css4you.de/wslayout1/ex0001.html

Ich hoffe das funktioniert auch bei dir. ;)

EDIT: Auch zu deiner ersten Frage gibt es bei CSS4You eine Übersicht.
LINK: http://www.css4you.de/wsdoctypeswitch/dtsw01.html
 
Hm.. da hab ich jetzt aber wieder das Problem, dass die Schrift über den Content Bereich geht, wenn die Schrift weiter ist als das Fenster und man aktualisiert :?

//edit: OK habe das Problem mit min-height gelöst (habs hochgeladen) Jetzt gibt es ein neues Problem: Warum ist die Seite höher als der Bildschirm obwohl da kein Content mehr ist?!
 
dementia schrieb:
Warum ist die Seite höher als der Bildschirm obwohl da kein Content mehr ist?!
Ganz einfach du hast der DIV-Content eine Höhe von 100% in der CSS gegeben. Somit ist der Content 100% hoch also so hoch wie das Fenster, hinzu kommt die DIV mit dem header.png. Somit ist der gesamte Bereich 120px höher als die Fensterhöhe. ;)
 
Stimmt da wäre ich garnicht draufgekommen..
Aber wie löse ich das? height: 100% -120px geht ja leider nicht..
 
Normalerweise müsste es reichen wenn du nur HTML, BODY und die Container DIV mit einer height von 100% machst. Versuche es mal vielleicht klappt es ja. ;)
 
wo is dein problem?
wenn du einen div auf 100% machst und darüber was is, dann is ja klar, dass die höhe dann 100%+*höhedesheaders* ist.
 
dementia schrieb:
Ja das hab ich mittlerweile auch verstanden aber wie löse ich das?
Also dementia

eine wirkliche Lösung dazu habe ich heute Morgen noch nicht gefunden, nur zwei Alternativen.
1.) Ein Hintergrundbild im Container das genau die Farben vom der Navi und Content hat, so dass es aussieht als würden diese über die gesamte Höhe gehen.
2.) Die Höhe für Navi und Content mit 80% angeben. Das ist zwar auch nicht optimal aber bei einer Bildschirmauflösung von 1024x768 haut es einigermaßen hin.

Ich bleibe aber am Ball, vielleicht findet sich ja doch noch eine bessere Lösung. ;)
 
ganz einfach, du integrierst den head, oder legst ihn per position:absolut drüber (content und navi dann mit padding-top:150px;). sollte doch irgendwas davon gehen.
 
Das darüberlegen mit position: absolute klappt nicht; der main div rutscht trotzdem nach unten, was eigentlich nicht der Fall sein dürfte :?

Und was meinst du mit integrieren?

Ich glaube das ganze liegt daran, dass es einen container div gibt in dem alles drin ist und in diesem container div noch einen content und navi div, die auch jeweils 100% hoch sind..

Wenn ich jetzt aber beim container div keine Höhe angebe ist der content auch nur noch so hoch wie der Inhalt.
 
1)navi
2)content
3)head
4)container

container:
text-align: center;
width: 100%;
height: 100%;

in den container dann
navi und content rein
für beides einfach
padding-top:*headhöhe*;

und den head dann mit
position: absolute;
width:100%;
height:*headhöhe*;
top:*margintop*;
text-align: center;

und in den head einfach


ach scheiss drauf, das schreit ja förmlich nach einem tabellenlayout!
 
Das mit dem position: absolute klappt jetzt aber dann bekomm ich den header mit margin: 0px auto nicht mehr in die Mitte (im ie gehts) ausserdem verschiebt sich der Content wieder 150px nach untent wenn ich oben ein padding-top mach :(

En Tabellenlayout wollt ich eigentlich nicht machen..

Oh gott hätte nicht gedacht, dass das so kopliziert wird..

//edit das mit dem paddingtop habe ich jetzt mit nem zweiten div im content gelöst.. Aber wie bekomme ich den Header auch im IE in ie Mitte?
 
garnicht, du machst den div mit 100% und darin ein

mit centrierter ausrichtung. könnte klappen, auch wenns unschön ist.
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben