div strecken

[Simon]

Hallo Leute!

Weiß einer von euch wie man einen div, bei mir im speziellen Fall div id="inhalt" auf das ganze Fenster streckt?
Einen Ansatz hab ich schon gefunden, doch der funktioniert nicht richtig nur in der Breite.

body {  
	margin: 0;  
	padding: 0;  
	height: 100%;  
    }

#inhalt {  
width: 100%;  
min-height: 100%; /* Mindesthöhe für moderne Browser */  
height:auto !important; /* Important Regel für moderne Browser */  
height:100%; /* Mindesthöhe für den IE */  
overflow: hidden !important; /* FF Scroll-leiste */  
} 

Danke und liebe Grüße aus dem verschneiten Tirol. (Ja ihr habt richtig gelesen SCHNEE!)

[Matze]

Hallo!

body {

height: 100%;
    }

  
100% wovon?  
  
Grüße, Matze  

[suit]

100% wovon?

Bemessen an der Höhe seines Elternelements, wovon sonst?

[Matze]

100% wovon?

Bemessen an der Höhe seines Elternelements, wovon sonst?

Und das ist welches? Und das ist wie hoch?

Grüße, Matze

[suit]

Und das ist welches?

In einem HTML-Dokument ist das Elternelement von body üblicherweise html.

Und das ist wie hoch?

Das weiß ich nicht, da der OP das nicht erwähnt hat.

[Matze]

Und das ist wie hoch?
Das weiß ich nicht, da der OP das nicht erwähnt hat.

Deshalb meine Frage "100% wovon?" :)

Wenn der OP jetzt noch mitliest und antwortet wären wir der Lösung seines Problems sehr nahe :)

Grüße, Matze

[Simon]

Deshalb meine Frage "100% wovon?" :)

Die Antwort darauf hab ich schon um 12:41 geschrieben. ein paar Zeilen weiter oben. Hier ist noch die Website von der ich die Infos habe. Vielleicht hilft es.
CSS Div height 100%

lg

[suit]

Vielleicht hilft es.
CSS Div height 100%

Du hast den Code nicht 1:1 übernommen, lies das Beispiel nochmal sowie die Diskussion zwischen Matze und mir.

[Simon]

Zuerst einmal vielen Dank!
Es haben sich jedoch zwei neue Probleme ergeben.
1.)Der div =id"inhalt" überlappt nicht die anderen divs.
2.) Der div html, body geht nur bis zum Ende des Fensters und nicht weiter (scrollen). Wobei das vielleicht mit dem anderen Problem zusammenhängt.

lg

[Matze]

Hallo Simon,

1.)Der div =id"inhalt" überlappt nicht die anderen divs.
2.) Der div html, body geht nur bis zum Ende des Fensters und nicht weiter (scrollen).

Wie meinen?
Ohne deinen Code zu kennen, können wir nicht wissen warum welche divs sich wo überlappen (sollen) und welche wo nicht.
Und was ist bitte "div html, body"?

Grüße, Matze

[Simon]

Also meine Website ist so auf gebaut, dass auf der Startseite nur die Menüs sichtbar sind. Was jetzt aber auch nicht mehr geht. Der div id ="inhalt" wird jetzt auch angezeigt.~~~css #menue1 {
   float: left;
position: absolute;
background-color: black;
height: auto;
width:450px;
/border-width:3px;
   border-style:solid;
border-color:black;/
margin-left:445px;
font-size: 40px;
text-align: center;
margin-top: 113px;
  }

#menue2 {
    border-width:3px;
border-color: red;
border-style:solid;
    height: 335px;
width: 450px;
margin-left: 900px;
    }
#menue3 {
border-width:3px;
border-color: blue;
border-style:solid;
    height: 335px;
width: 450px;
margin-left: 445px;

Wenn man jetzt einen Menüpunkt anklickt soll der div id="inhalt" über die ganze Startseite geöffnet werden.  
~~~css
#inhalt {  
  opacity: 0.93;  
  filter:alpha(opacity=93); /* Internet Explorer 4-8 */  
  background-color: black;  
width: 100%;  
min-height: 100%; /* Mindesthöhe für moderne Browser */  
height:auto !important; /* Important Regel für moderne Browser */  
height:100%; /* Mindesthöhe für den IE */  
overflow: hidden !important; /* FF Scroll-leiste */ 

div html, body = ist der body und das html. Es ist gar kein div. War mein Fehler. lg

[Matze]

[code lang=css] #menue1 {
   float: left;
position: absolute;

Bei absoluter Positionierung ist eine float-Angabe überflüssig. Bzw. bewirkt float dann nichts mehr. Das Element wurde ja aus dem Fluss genommen, also kann auch nichts mehr drumherum fließen.

height: auto;

height: auto; kannst du dir vermutlich sparen.

margin-left:445px;
margin-top: 113px;

Bei absoluter Positionierung fällt margin weg. Siehe oben.

Wenn man jetzt einen Menüpunkt anklickt soll der div id="inhalt" über die ganze Startseite geöffnet werden.

Mal langsam. Kann es sein, dass du versuchst eine "Lightbox" nachzubauen?

Im übrigen empfehlen sich für Menüs Listen (<ul>) und keine div-Suppe.

Ohne deinen HTML-Code oder deine Seite zu kennen, kann ich dir ansonsten nicht helfen. Ohne Beispiel kann man dein Problem nur schwer nachvollziehen. Quasi gar nicht.

Grüße, Matze

[Fyll]

Hallo

Einen Ansatz hab ich schon gefunden, doch der funktioniert nicht richtig nur in der Breite.

.. müsste aber so funktionieren.
Dein Fehler muss wo anders liegen.

MfG

[Simon]

Dein Fehler muss wo anders liegen.

Wo könnte der Fehler denn liegen? Die 100% im body, sollen theoretisch bedeuten, das der div="inhalt" sich auf das ganze Fenster streckt.
Allgemein gesagt 100% bedeutet es streckt sich auf das ganze Fenster. Die anderen Formulierungen sind nur für die anderen Browser, denn height: 100%; wird nur vom IE akzeptiert. Das funktioniert bei mir jedoch alles nicht.

MfG

[Fyll]

Dein Fehler muss wo anders liegen.

Wo könnte der Fehler denn liegen?

Da ich den Rest deines Codes nicht kenne, kann ich dir diese Frage auch nicht beantworten... ^^

Hast du <div id="inhalt">blabla</div> stehen?
Ich gehe mal davon aus, dass du an einer anderen Stelle fehlerhaftes CSS stehen hast, weshalb dein IE den Rest nicht beachtet.

Ich würde dir raten, den Code mal durch einen Validator zu jagen...

MfG

[Der Martin]

Hallo,

Die 100% im body, sollen theoretisch bedeuten, das der div="inhalt" sich auf das ganze Fenster streckt.

nein, die 100% bedeuten, dass body 100% seines Elternelements einnehmen soll. Welches das ist, hat suit dir ja inzwischen auch schon erklärt.
Wie hoch ist also dein html-Element? Wenn du ihm nicht explizit eine Höhe zugewiesen hast, hat es die Defaulteinstellung "auto", damit ist es nur so hoch, wie es der Inhalt erfordert.

Allgemein gesagt 100% bedeutet es streckt sich auf das ganze Fenster.

Nein, das gilt nur für das html-Element, da dieses kein weiteres Elternelement mehr hat.

Die anderen Formulierungen sind nur für die anderen Browser, denn height: 100%; wird nur vom IE akzeptiert. Das funktioniert bei mir jedoch alles nicht.

Hä?

So long,
 Martin

[Simon]

Hä?

min-height: 100%; /* Mindesthöhe für moderne Browser */  
height:auto !important; /* Important Regel für moderne Browser */  
height:100%; /* Mindesthöhe für den IE */  
overflow: hidden !important; /* FF Scroll-leiste */ 

Habe es bereits gelöst. Danke für die richtigstellung meiner Definition der 100%
lg