nicht angemeldet
Div-Container: Kann keine divs mit relativer Größe definieren
0 0 0 0 0 0 0 0
Div-Container: Kann keine divs mit relativer Größe definieren
Der MartinHi Leute,
habe mal wieder nen kleines Problem: Ich will die Größe von divs definieren. Eigentlich kein Problem, jedoch funktioniert es einfach nicht.
habe folgendes vor: Ein div über die ganze Seite, der wrapper, dann oben ein div mit 100% Breite und 25% höhe.
Dadrunter zwei Divs die jeweils die restlichen 75% der Höhe einnehmen. Das eine ist dann 40% groß, das daneben soll 60% groß sein.
Geht einfach nicht. Habe die alle mit Rahmen versehen um zu schauen ob ales klappt, habe dann einen schönen dicken grauen Strich am oberen Bildschirmrand.
Code sieht so aus:
<div id="wrapper" style="width: 100%; height: 100%;">
<form name="formhead">
<div id="head" style="float: top; width: 100%; height: 25%; border: 1px solid silver;">
</div>
</form>
<form name="formEins">
<div id="tabBar" style="width: 40%; height: 75%; float: left; border: 1px solid silver; display: block;">
</div>
</form>
<div id="imgDiv" style="float: right; border: 1px solid silver; width: 60%; height: 75%">
</div>
</div>
Was lief da schief? Muss ich da andere Attribute reinsetzen?
Danke im voraus.
-
Was lief da schief? Muss ich da andere Attribute reinsetzen?
Ja, denn aus deinem Code wird ggf. nur mit viel Glück und schönem Wetter ein brauchbares Ergebnis.
float: top;z.B.Dein eigentliches Problem scheint ein mathematisches zu sein: dein "wrapper" hat 100% der Höhe seines Elternelements
-
Hmm, ok, habe jetzt den Wrapper rausgenommen, hat nix geändert.
-
Hmm, ok, habe jetzt den Wrapper rausgenommen, hat nix geändert.
Das denk' ich mir - denn jetzt sind deine Elemente halt direkt Kinder des ehemaligen Elternelements des Wrappers. Die zusammen 100% der Höhe dieses Elements ausmachen.
-
Hmmm, jaaaaa..... =)
was heißt das jetzt konkret für mich? Die divs sidn doch jetzt sozusagen Kinder vom Body. Zusammen ergeben die auch in alle Richtungen 100%. Habe gerade nen kleines Verständnisproblem mit dem was du sagst.
Trotzdem erstmal danke ;)
-
was heißt das jetzt konkret für mich? Die divs sidn doch jetzt sozusagen Kinder vom Body. Zusammen ergeben die auch in alle Richtungen 100%. Habe gerade nen kleines Verständnisproblem mit dem was du sagst.
Ich versuche dir zu sagen, dass 100% der Höhe von <body /> exakt der Höhe von <body /> entspricht.
-
naja, so soll es ja auch eigentlich sein, insgesamt sollen alle 3 Felder zusammen 100% der Fläche ergeben die ich im Browser sehen kann. Also 100% der Seite. Wieso ist das falsch?
-
naja, so soll es ja auch eigentlich sein, insgesamt sollen alle 3 Felder zusammen 100% der Fläche ergeben die ich im Browser sehen kann.
Momentan sind die drei aber 100% der Höhe von <body />
Also 100% der Seite. Wieso ist das falsch?
<body /> ist nicht zwangsläufig so hoch wie der Anzeigebereich deines Browsers.
-
OK, das dachte ich eigentlich dass body den ganzen Bereich des Fensters einnimmt. Welche Höhen muss ich dann also definieren? Gibt es nen fixwert den man von 100% abziehen muss?
-
Hi,
OK, das dachte ich eigentlich dass body den ganzen Bereich des Fensters einnimmt.
so kann man sich irren. Das body-Element ist ohne weitere Vorgaben nur so hoch wie sein Inhalt. Wenn der Inhalt wiederum 100% der Höhe von body haben soll, definierst du damit indirekt: Das Element soll 100% seiner eigenen Höhe haben.
Welche Höhen muss ich dann also definieren? Gibt es nen fixwert den man von 100% abziehen muss?
Nein, wieso? Aber du musst dem body und dessen Elternelement auch eine konkrete Höhe geben. "100%" wäre eine günstige Angabe.
Ciao,
Martin--
Husten kann böse Folgen haben.
Besonders im Kleiderschrank.-
OK, das hatte ich eigentlich auch schon mal ausprobiert, hatte aber auch nicht geholfen, genau wie jetzt:
<body style="width: 100%; height:100%;"> <form name="formhead"> <div id="head" style="float: top; width: 95%; height: 23.5%; border: 1px solid silver;"> </div> </form> <form name="formEins"> <div id="tabBar" style="width: 37.5%; height: 73.5%; float: left; border: 1px solid silver; display: block;"> </div> </form> <div id="imgDiv" style="float: right; border: 1px solid silver; width: 57.5%; height: 73.5%"> </div> </body> </html>Das kann doch nicht so schwer sein oder bin ich einfach nur zu dämlich?
-
OK, das hatte ich eigentlich auch schon mal ausprobiert, hatte aber auch nicht geholfen, genau wie jetzt:
<body style="width: 100%; height:100%;">
Das kann doch nicht so schwer sein oder bin ich einfach nur zu dämlich?darum sagte ja Martin auch
»» [...] und dessen Elternelement [...]
-
Hmm, ok. Der Body ist jetzt mein Elternelement. Der soll 100% der Größe haben. Aber was ist dann das Elternelement vom Body? Hat der überhaupt sowas?
OK, was müsste ich jetzt konkret machen? wer muss 100% groß sein und was muss ich den divs zuweisen?
-
hi $name,
Hmm, ok. Der Body ist jetzt mein Elternelement. Der soll 100% der Größe haben. Aber was ist dann das Elternelement vom Body? Hat der überhaupt sowas?
OK, was müsste ich jetzt konkret machen? wer muss 100% groß sein und was muss ich den divs zuweisen?
das elternelement von <body> ist <html> - wird oft vergessen, verpass dem per CSS auch 100%.
gruss
shadow--
Vor dem Parser und auf hoher See sind wir allein in Gottes Hand
-
-
-
-
-
-
-
-
-
-
-
-