it-swarm.com.de

Für div, um die volle Höhe auszudehnen

Gibt es eine Methode, mit der ein div auf volle Höhe erweitert werden kann? Ich habe auch eine klebrige Fußzeile darin.

Hier ist die Webseite: Website entfernt . Das mittlere Bit, über das ich spreche, ist das weiße div, midcontent, das CSS-Werte hat:

.midcontent{
     width:85%;
     margin:0 auto;
     padding:10px 20px;
     padding-top:0;
     background-color:#FFF;
     overflow:hidden;
     min-height:100%;
     max-width:968px; 
     height:100%;
}

Also ja, offensichtlich hat height:100% nicht funktioniert. Darüber hinaus haben ALLE übergeordneten Container die eingestellte Höhe.

Hier ist die allgemeine Struktur

<body>
    <div id="wrap">
        <div id="main">
            <div class="headout">
                <div class="headimg"></div>
            </div>
            <div class="midcontainer"></div>
        </div>
    </div>
    <div id="footer">
        <div class="footer"></div>
    </div>
64
bear

Haben Sie sich daran erinnert, die Höhe der HTML- und Body-Tags in Ihrem CSS festzulegen? Im Allgemeinen habe ich DIVs dazu gebracht, sich auf volle Höhe auszudehnen:


<html>
  <head>
    <style type="text/css">

      html,body { height: 100%; margin: 0px; padding: 0px; }
      #full { background: #0f0; height: 100% }

    </style>
  </head>
  <body>
    <div id="full">
    </div>
  </body>
</html>


125
Tom

Dies könnte hilfreich sein: http://www.webmasterworld.com/forum83/200.htm

Ein relevantes Zitat:

Die meisten Versuche, dies zu erreichen, wurden durch Zuweisen der Eigenschaft und des Werts gemacht: div {height: 100%} - dies alleine wird nicht funktionieren. Der Grund ist, dass kein Elternteil definiert ist height, das div {height: 100%;} hat keinen Einfluss auf 100% Prozent und wird standardmäßig auf eine .__ gesetzt. Wert von div {height: auto;} - auto ist ein "nach Bedarf" -Wert, der durch das tatsächliche .__ geregelt wird. Inhalt, so dass das div {height: 100%} nur so weit reicht, wie es der Inhalt verlangt.

Die Lösung des Problems wird gefunden, indem dem übergeordneten Container ein Höhenwert .__ zugewiesen wird. in diesem Fall das Körperelement. Schreiben Sie Ihre Körpergröße, um die Höhe der Vorräte von 100% einzuschließen der benötigte Wert.

html, body { 
  margin:0; 
  padding:0; 
  height:100%; 
}
37
Brian Clapper

wenn die Einstellung der Höhe auf 100% nicht funktioniert, versuchen Sie min-height = 100% für div. Sie müssen noch das HTML-Tag setzen.

html {
    height: 100%;
    margin: 0px;
    padding: 0px;
    position: relative;
}

#fullHeight{

    width: 450px;
    **min-height: 100%;**
    background-color: blue;

}
0