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

100% Höhe aber nur teilweise...

Status
Für weitere Antworten geschlossen.
Prophet

Prophet

Super-Moderator
Moderator
100% Höhe aber nur teilweise...

Ich habe eine seite welche ich mit 100% höhe austatten will.

das ist auch kein problem jedoch soll der header nur 100px hoch sein und der rest den rest bedecken. nun habe ich das problenm das ich einen wert wie 100%-100px für doe anderen elmente bräuchte. jedoch weiß ich nicht wie ich das realisieren soll...

quelltext foolgt später...
 
Werbung:
Geht das nicht irgendwie so?

Code: 
#Beispiel
{
position:absolute;
top:100px;
left:0px;
width:100%;
height:100%;
}
 
Quelltext:
Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>
	<head>
		<style type="text/css">
			<!--
				*
				{
					padding:0px;
					margin:0px;
				}
				html
				{
					height:100%;
				}
				body
				{
					background-color:black;
					height:100%;
				}
				div#header
				{
					background-color:green;
					width:750px;
					height:100px;
				}
				div#navigation
				{
					float:left;
					background-color:blue;
					width:150px;
					height:100%;
					overflow:auto;
				}
				div#content
				{
					background-color:red;
					width:600px;
					height:100%;
					overflow:auto;
					margin-left:150px;
				}
			-->
		</style>
	</head>
	<body>
		<div id="header">

		</div>
		<div id="navigation">

		</div>
		<div id="content">

		</div>
	</body>
</html>

und zum anschauen: http://prophet.argoedv.de/test/test.htm

ich glaube nicht das dein ansatz funktioniert weil du die 100% höhe nur nach unten verschiebst...

mir ist ebenfalls ein rätsel warum der float nicht funktioniert...
 
Werbung:
Erstell einen Container mit 100% Höhe. Darauf legst du den Header mit 100px Höhe. Dem Text (oder was auch immer), der in den Container rein soll, gibst du den Abstand top:100px, dann sollte er unter dem Header stehen. Oder du erstellst einen Container mit 100% Höhe, setzt dort den header rein und darunter noch einen Container, wo dann der Inhalt rein kommt. Oder was meinst du?

Außerdem klappt es doch auf der Seite...?
 
oh entschuldige das ist die komplett relative seite...

quelltext ist nun auf das problem zurückgeschrieben...

auf der seite siehst du ja wie es sein soll:

header 100px höhe
navi 150px breit float 100%vom rest höhe
content das selbe wie die navi nur nicht floating....

die einzige lösung die mir einfällt ist tabellen aber das wäre für mich die allerletzte möglichkeit....
 
Code: 
<html>
<body style="margin:0px; padding:0px;">

<div style="width:100%; height:100%; background-color:#000000;">

<div style="position:absolute; width:100%; height:100px; background-color:#ff0000;"></div>

<div style="float:left; width:150px; height:100%; background-color:#00ff00;">
<div style="margin-top:110px; width:150px;">Navigation</div>
</div>

<div style="float:left; width:500px; height:100%;">
<div style="margin-top:110px; margin-left:20px; width:500px; color:#ffffff;">Content</div>
</div>

</div>

</body>
</html>

Und das sieht bei mir so aus (da entstehen keine Scrollbalken):
http://img406.imageshack.us/img406/4844/screen7om.png
 
Werbung:
passt es sich auch jeder bildschirm größe an? die scrollbalken sind wichtig ich guck margen mal was ich draus machen kann...
 
Werbung:
ja genau keine angst die website wird nachehr nicht solche farben haben...

EDIT: ich bekomme das nicht vernünftig zum laufen... vor allem verstehe ich dein beispiel teilweise nicht...
ausserdem habe ich auch ein problem dort scrollbars einzubauen...
 
Werbung:
Prophet schrieb:
die scrollbalken sind wichtig ich guck margen mal was ich draus machen kann...
Zum Vergrößern anklicken....
Doch ich wollte mit scrollbalken. und der für den ich die seite erstellle will nun auch 100% der weite...

Warum zb die navi und der content bereich im header feld drinne sind...

aber ich glaube so sehr es auch gegen die semantik verstößt hier muss eine tablle ran... das ist erstens einfacher und zweitens einfach kürzer...

EDIT:

Na toll... Selbst mit tabellen funktioniert es nicht weil opera 100% höhe dafür nicht unterstützt und der ie für die content felder wieder 100% der gesamt seite nimmt....
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben