• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Div Height auto an Inhalt anpassen

Rotut

Neues Mitglied
Hallo,

ich habe eine Centerbox (bzw. 2 - eine für Shadow) eingebaut um den INhalt in der Mitte der Seite anzuzeigen.
Nun möchte ich, dass der Hintergrund dieser Centerbox immer so lang ist wie deren INhalt.

index

Code:
<body>

<div id="centerbox_shadow">
<div id="centerbox">

 <div id="header">
 </div>

 <div id="gratis">
 <a href="anmelden.php" class='kugel_anmelden'><img src='grafik/b_blank_200x200.png' border='0' width='200' height='200'></a>
 </div>
 <div id="gratis2">
 <a href="anmelden.php" class='kugel_anmelden2'><img src='grafik/b_blank_200x200.png' border='0' width='200' height='200'></a>
 </div>

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

</div>
</div>
</body>
Style

Code:
body {
  width:1000px;
  height:100%;
  margin:0; padding:0;
  background:transparent url(../grafik/hintergrund.png);
}
#centerbox_shadow {
  position:absolute;
  left:50%;
  width:1040px;
  height:100%;
  margin-left:-520px;
  z-index: 1;
  background:transparent url(../grafik/hintergrund_shadow.png);

}
#centerbox {
  position:absolute;
  left:50%;
  width:1000px;
  margin-left:-500px;
  z-index: 1;
  background: white;
}
#header{
  width:1000px; height:300px;
  position:absolute; top:0px; left:0px;
  margin:0px;
  padding:0px;
  background:transparent url(../grafik/header.png) no-repeat top left;
}
#gratis{
  width:200px; height:200px;
  position:absolute; top:200px; left:800px;
  margin:0px;
  padding:0px;
}
#gratis2{
  width:200px; height:200px;
  position:absolute; top:1600px; left:100px;
  margin:0px;
  padding:0px;
}

#content{
  width:100px; height:;
  position:absolute; top:320px; left:100px;
  margin:0px;
  padding:0px;
  background:red;
}
zum test habe ich den Div-tag gratis2 in der Höhe 1600px gesetzt. aber die 100% height beziehen sich immer nur auf die Höhe des Bildschirms habe ich den Verdacht. Wenn ich Auto eingebe so wird das Hintergrundbild des centerbox_shodow gar nicht angezeigt?

Auch wenn ich im Content Text einfüge der über die Seite nach unten hinaus geht bleibt der Hintergrund des centerbox shadow nur auf größe des Bildschirms?!

Kann mir jemand meinen Denkfehler zeigen?!

Danke...
 
Komisch - wenn ich overflow: auto; einfüge dann kommt (klar :-)) eine Scrollbar innerhalb. Das komische aber ist, dass diese Scrollbar den inhalt mitzieht und die Hintergründe somit passen.

Warum geht es nicht in der "main" scrollbar??
 
Ich fürchte, die Beantwortung deiner Frage ist mit zuviel Aufwand verbunden, da dein Beispiel aufgrund der lokal nicht vorhandenen Grafiken kaum testbar ist. Wenn ich mir aus deinem Code eine HTML-Seite erstelle, sehe ich in der Ausgabe nur eine weiße Seite mit einem Scrollbalken. Es ist mir einfach zu umständlich, mir aus deinem Code und deiner Beschreibung herzuleiten, was du da genau machen willst. Lege die Latte mal etwas niedriger und biete ein Komplettbeispiel mit Grafiken als Zip oder so an.

Edit: Crosspost: http://www.php.de/html-usability-un...ntergrund-automatisch-so-lang-wie-inhalt.html
 
Zuletzt bearbeitet:
Zurück
Oben