crypt0: Feste und Variable größe ...

Also folgendes ich hab einen "Kopf" in meiner Seite mit der navi. und zwei Bannern. der soll immer eine feste Höhe haben, da die Bilder nicht variabel sind.  dann kommt unendrunter der eigentliche Inhalt. der soll in der Höhe variabel sein, also die restlichen xx% ausfüllen. Immer bis zum Boden derseite.

Ich habs jetzt mal so gemacht:

:code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>crypt0.de</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
 height:100%;
 padding:0;
 margin-left: 0px;
 margin-top: 0px;
 margin-bottom: 0px;
 margin-right: 0px;
 background-color: #CCCCCC;
}
.Stil1 {color: #000000; font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; }
.Stil2 {color: #000000; font-family: Arial, Helvetica, sans-serif; font-size: 12px; }
.Stil3 {color: #999999; font-family: Arial, Helvetica, sans-serif; font-size: 12px; }

#schwarzelinie {background-color:#000000; width:801px; height:100%}
#head {background-image: url('kopf.jpg'); width: 800px; height: 81px }
#menuleiste {background-image: url('navi.jpg'); width: 800px; height: 30px }
#balken {background-image: url('balken_blau.jpg'); width: 800px; height: 92px}
#subnavi {background-color:#999999; width:150px; height:}
#content {margin:0 0 0 150px; background-color:#FFFFFF; width:650px; height:100%}
-->
</style>
</head>

<body>
<div id="schwarzelinie">
 <div id="subnavi">
  <div id="head"></div>
  <div id="menuleiste"></div>
  <div id="balken"></div>

<div id="content"></div>
 </div>
</div>
</body>
</html>

:code:

aber der untere teil unter dem "Kopf" (content) ist zu groß der ist 100% vom Browserfenter aber keine 100% von meinem Kopf aus.

Es muss also irgendwie so sein: Höhe Kopf - 100% = Höhe content

gibt es da eine Lösung oder soll ich was anders machen ?

  1. Hallo!

    aber der untere teil unter dem "Kopf" (content) ist zu groß der ist 100% vom Browserfenter aber keine 100% von meinem Kopf aus.

    Es muss also irgendwie so sein: Höhe Kopf - 100% = Höhe content

    Wenn ich Dein Posting richtig verstanden habe, dann hast Du oben einige Elemente deren Höhe Du in absoluten Pixel kennst und Du willst darunter einen content-Bereich haben der exakt das restliche Fenster verwendet.
    Also so kann es m.E. nicht funktionieren, denn in CSS und HTML kann man nicht rechnen!
    Man kann das Browserfenster mittels Prozentangaben teilen (oben 20%, unten 80%), aber es gibt keine Möglichkeit die Prozente in Pixel umzurechnen.

    Beste Grüße
    Viennamade

    1. ja hast du richtig verstanden.

      hm. okay dann muss ich das wohl irgendie anders zusammenbauen ...

  2. Hi

    Es muss also irgendwie so sein: Höhe Kopf - 100% = Höhe content

    <div style="height:100%; background-color:blue; margin:0;">
      <div style="height:100px; background-color:red;">Kopf hoch
      </div>Content
    </div>

    Gruss
    chlori

    1. das geht auh nicht gescheit vll weil ich es 2 mal verschahtelt habe

      1. Hi

        das geht auh nicht gescheit vll weil ich es 2 mal verschahtelt habe

        Dann verschachtelst du halt weiter...

        <div style="height:100%; background-color:blue; margin:0;">
          <div style="height:100px; background-color:red;">Kopf hoch
          </div>
          <div style="height:40px; background-color:green;">Navi Navi
          </div>Content
        </div>

        Gruss
        chlori

  3. Tachchen!

    Die Möglichkeiten sind vielfältig:

    Zuerst brauchst du dringen einen Contentbereich, der die kompletten
    100% Höhe des Fensters ausmacht ... dazu massig im Archiv.

    In diesen kannst du dann einfach Kopf und Inhalte untereinander schreiben
    oder den Inhalten ein margin-top verpassen und den Kopf absolut positionieren
    oder ... oder ...

    Gruß

    Die schwarze Piste