nicht angemeldet
"height" eines Elements
Hallo!
Ich möchte gerne eine Navigationsleiste auf der linken Seite einer Homepage mit CSS formatieren: Frames möchte ich nicht nutzen und Tabellen haben ja eigentlich einen anderen Zweck.
Wenn ich nun für das entsprechende Element (<div>) die Höhe mit 100% angebe, ist die Box genau so hoch wie das Browser-Fenster. Passt der Text nicht mehr ganz auf die Seite, kann man zwar scollen, aber die Navigationsleiste, die eigentlich den ganzen linken Rand zieren soll, hört auf.
Bei einer größeren Höhenangabe, z.B. 1000%, wird die Navigationsleiste viel länger als der eigentliche Inhalt einer Seite, und auch absolute Angaben bringen micht nicht weiter, da die Länge der Seite ja auch von der beim Anwender eingestellten Schriftgröße abhängt.
Gibt es eine Möglichkeit, die Höhe für ein <div>-Element so anzugeben, dass sie immer der Höhe der gesamten Seite entspricht, aber nicht länger wird?
Danke für Hinweise zur Lösung,
Perter
-
Gibt es eine Möglichkeit, die Höhe für ein <div>-Element so anzugeben, dass sie immer der Höhe der gesamten Seite entspricht, aber nicht länger wird?
position: fixed.
-
Moin!
position: fixed.
Lustige Idee (!), die man so gerade eben als Lösung durch gehen lassen könnte,
wenn nicht mehr als 90% der Browser es ignorieren würden.Gruß
Der Hans
-
-
Wenn ich nun für das entsprechende Element (<div>) die Höhe mit 100% angebe, ist die Box genau so hoch wie das Browser-Fenster. Passt der Text nicht mehr ganz auf die Seite, kann man zwar scollen, aber die Navigationsleiste, die eigentlich den ganzen linken Rand zieren soll, hört auf.
Mag sein, daß ich Dich falsch verstanden habe, aber dieses Verhalten erscheint mir fragwürdig, denn eine Höhe "100%" mit der Höhe des Browserfensters gleich zu setzen, ist ein wenig kritisch, denn sobald die Höhe des Fensterinhalts ungleich der des Fensters selbst ist, kommt es zu Konflikten: Wie will man mit diesem System ein Element setzen, das so hoch sein soll, wie das Dokument?
Benutzt Du einen in Sachen CSS vernünftigen Browser (Gecko, Opera), hast den Layout-Modus auf standardkompatibel gestellt (http://www.hut.fi/~hsivonen/doctype.html) und -wo wir schon dabei sind- eine Syntaxprüfung mit http://validator.w3.org und http://jigsaw.w3.org/css-validator/ durchgeführt? Falls nicht, solltest Du Dich besser nicht auf das Verlassen, was Dein Browser Dir anzeigt - und zwar erst recht, weil Du kein Tabellenlayout haben möchtest.
Gibt es eine Möglichkeit, die Höhe für ein <div>-Element so anzugeben, dass sie immer der Höhe der gesamten Seite entspricht, aber nicht länger wird?
Womit wir dann exakt bei dem Problem wären, welches ich oben angerissen habe: height (wie auch alle anderen gleichartigen Angaben) bezieht sich eigentlich auf die Höhe des Containers, in dem das betreffende Element liegt. Die daraus logische Folge ist, daß das von Dir bereits eingesetzte height:100% der Höhe des Dokuments entspricht und nicht der Höhe des Browserfensters. In einem Satz: Du hast richtig gedacht, der Hersteller Deines Browsers hat's verbockt.
Erster Lösungsansatz wäre, dem Browser standardkonformes Verhalten aufzuzwingen (siehe oben). Willst Du das nicht (was sehr schade wäre, denn was gibt es Verlässlicheres als einen offenen Standard), kannst Du auch versuchen, mit top:0 und bottom:0 die Gesamthöhe zu erreichen.
Gruß,
soenk.e -
Hi,
Ich möchte gerne eine Navigationsleiste auf der linken Seite einer Homepage mit CSS formatieren: Frames möchte ich nicht nutzen und Tabellen haben ja eigentlich einen anderen Zweck.
Guter Ansatz.
Gibt es eine Möglichkeit, die Höhe für ein <div>-Element so anzugeben, dass sie immer der Höhe der gesamten Seite entspricht, aber nicht länger wird?
Versuch doch mal folgendes:
body {
height:100%;
[...]
}
.navigation {
height:100%;
position:fixed;
display:block;
float:left;
width:???px;
color:#??????;
background-color:#??????;
padding:0px;
margin:0px;
}und dann in der HTML-Datei:
[...]
<body>
<div class="navigation">
<p>blablubb</p>
</div>
[...]Viele Grüße
Torsten--
Wäre Stoizismus eine Programmiersprache, würde ich ein Experte sein.
Sick of Starsearch & Superstar? Try this one: http://www.typeonegative.net/discog.html