Gunnar Bittersmann: IE6 und height bzw angezeigte höhe eines div

Beitrag lesen

Hello out there!

Ich greife immer wieder auf die vorstellung einer tabelle zurück und scheitere vielleicht auch gerasde deshalb ständig mit meinen plazierungsversuchen.

Das Denken in Tabellen kann in der Tat äußerst hinderlich sein.

Nur ich weiß nicht, wie ich mir das sonst vorstellen sollte?

Absolute Positionierung wäre wie eine Pinnwand, an die du Zettel, die unterschiedliche Größe haben können, anheftest. Welche dabei vollständig sichtbar sind und welche verdeckt, regelt der z-Index.

Floatende Boxen sind wie Zettel, die du so weit wie möglich links (bzw. rechts) oben anpinnst, ohne dass sie sich überlappen. Passt der nächste Zettel nicht neben (bzw. zwischen) die schon vorhandenen, kommt er halt darunter.

Und weil es hier im thread angesprochen war: Ich kann mir unter dem html element visuell überhaupt nichts vorstellen

Das ist das Wurzelelement des Dokuments; die äußerste Box im Viewport.

schon gar nicht im verhältnis zum body.

'body' ist ein Kind von 'html'; dessen Box liegt in der von 'html'-Box (sofern nicht aus dem Fluss genommen), wobei auch beide dieselbe Größe haben können.

Soweit man ( wie ich ) keine frames verwendet ist doch visuell body-element = html-element.

Nein, nicht unbedingt:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
 <head>  
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
  <title>Lorem ipsum</title>  
  <style type="text/css">  
[code lang=css]   html  
   {  
    background: black;  
   }  
  
   head  
   {  
    display: block;  
    background: lightblue;  
   }  
  
   head *  
   {  
    display: none;  
   }  
  
   head title  
   {  
    display: block;  
   }  
  
   body  
   {  
    background: orange;  
height: 100%;  
   }

</style>
 </head>
 <body>
  <p>Lorem ipsum dolor sit amet.</p>
 </body>
</html>[/code]

Ich kann mir schon unter <body height=100%> nichts vorstellen.

Das solltest du auch _nie_ verwenden. Für _sämtliche_ Darstellungsangaben ist CSS da, nicht veraltete HTML-Attribute.

Also bitte im Stylesheet body {height: 100%}

100% von was? Vom html-element?

Geanu.

Was stellt den <html height=100%> dar?

Siehe oben. html {height: 100%} gibt an, dass die 'html'-Box so hoch ist wie der Viewport.

Was wäre <html height=50%>

Bei html {height: 50%} ist die Box eben halb so hoch wie der Viewport. Wobei eine Hintergrundfarbe dennoch (evlt.?) den gesamten Viewport ausfüllt:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
 <head>  
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
  <title>Lorem ipsum</title>  
  <style type="text/css">  
[code lang=css]   html  
   {  
    background: black;  
    border: 3px solid white;  
    height: 50%;  
   }  
  
   head  
   {  
    display: block;  
    background: lightblue;  
   }  
  
   head *  
   {  
    display: none;  
   }  
  
   head title  
   {  
    display: block;  
   }  
  
   body  
   {  
    background: orange;  
   }

</style>
 </head>
 <body>
  <p>Lorem ipsum dolor sit amet.</p>
 </body>
</html>[/code]

See ya up the road,
Gunnar

--
„Wer Gründe anhört, kommt in Gefahr nachzugeben.“ (Goethe)