✔ seite immer 100% hoch?

Status
Nicht offen für weitere Antworten.
Kalma

Kalma

Erfahrenes Mitglied
Hallo,

habe viel gesucht, aber nichts gefunden.

Ich habe eine Seite, die ca. 900px breit ist, und immer von Anfang Browser-Fenster bis unten Browser-Fenster gehen soll, egal wie hoch der Bildschirm und wie viel Inhalt da ist.


Ist das möglich?

mFg
david
 
Hi,

selbstverständlich ist das möglich.

Code: 
html,body {
height: 100%;
margin: 0;
padding: 0;
}

div#wrapper {
width: 900px;
min-height: 100%;
height: auto !important;
height: 100%;
background: #ffff00;
}

Code: 
<body>
        <div id="wrapper">...</div>
</body>
 
Wird das denn von allen Browsern "richtig" interpretiert? Vor allem Firefox und IE sollten das können, da diese Seite am meisten von diesen Browsern besichtigt werden wird.
 
Mach dir da mal keine Sorgen, denn für den Firefox (und die anderen modernen Browser) gilt dieser Block:

Code: 
min-height: 100%;
height: auto !important;

und für den IE gilt dieser:

Code: 
height: 100%;
 
Doch noch ein Problem :rolleyes:


Also, ich schreibe ca. 100mal "Hello" nebeneinander. Ist das zu vermeiden, das man über den Rand der eigentlichen Breite hinausgeht?
 
Lass mich raten, du hast das Wort hundertmal ohne Leerzeichen notiert? Dann ist es auch normal, dass das Layout in der Breite auseinandergedrückt wird.
 
Hallo,

ich habe es wieder einmal probiert, allerdings funktioniert es nicht.
Dies ist mein CSS Code:
Code: 
html {
        height: 100%;
}

body {
	background-image:url(images/background.jpg);
  	background-repeat:repeat;
	font-family:"Arial", Verdana;
	font-size:small;
        height: 100%;
	margin:0px;
	padding:0px;
}

#wrapper {
	width:762px;
        min-height: 100%;
        height: auto !important;
        height: 100%;
	margin:0px auto;
	padding:0px;
	text-align:left;
}

#header_kopf {
	background-image:url(images/header_kopf.jpg);
	background-repeat:no-repeat;
	font-size:x-small;
	text-align:right;
	line-height:25px;
	height:20px;
	margin:0px;
	padding:0px 35px 0px 0px;
}

#header {
	background-image:url(images/header.jpg);
	background-repeat:no-repeat;
	height:192px;
	margin:0px;
	padding:0px;
}

#navigation {
	background-image:url(images/navigation.jpg);
	background-repeat:no-repeat;
	font-family:"Rockwell Condensed", Playbill, Haettenschweiler, Arial;
        font-size:16px !important;
        font-size:24px;
        font-weight:bold;
	line-height:70px;
	height:72px;
	margin:0px;
	padding:0px 0px 0px 45px;
}

#navigation a:link, #navigation a:visited {
	color:#000000;
	text-decoration:none;
	margin:0px 5px 0px 0px;
	padding:0px;
}

#content {
	background-image:url(images/content.jpg);
	background-repeat:repeat-y;
        min-height:auto !important;
        height:auto !important;
	margin:0px;
	padding:0px;
}

#footer {
	background-image:url(images/footer.jpg);
	background-repeat:no-repeat;
	height:36px;
	margin:0px;
	padding:0px;
}

Muss ich noch was ändern?
P.s. Wie zentriert man im IE?
 
Hi,

kannst du bitte auch näher erläutern, was an dem Stylesheet nicht wie gewünscht funktioniert?

Denn das DIV #wrapper besitzt in allen mir zur Verfügung stehenden Browsern eine Mindesthöhe von 100% und ist zudem im IE horizontal zentriert.

Eine weitere Möglichkeit des horizontalen Zentrierens im IE wäre:

Code: 
body {
text-align:center;
}
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück