Background "wächst" nicht mit

Status
Nicht offen für weitere Antworten.

mAu

Erfahrenes Mitglied
Hilfe :)

Folgendes: Bei dieser Seite sollte sich der Hintergrund (einfach das weiße, nicht das Bild) eigendlich mit dem Content mit verlängern, meine Vermutung ist, dass es aufgrund der position-Angabe der Contentelemente jedoch nicht funktioniert. Beispiel hier (roter Rahmen nur zum verdeutlichen): http://zurv.de/pap/buch.html

Die relevanten CSS-Ausschnitte sind vermutlich (http://zurv.de/pap/css/main.css):
CSS:
#container {
    background: #fff url('../images/container-background.jpg') no-repeat;
    border: 1px solid red;
    font-family: 'Times New Roman';
    margin: 0 auto;
    width: 900px;
    height: 600px !important;
    min-height: 600px;
    position: relative;
    overflow: visible;
}

#content {
    background-image: url('../images/content-background.png');
    color: #656460;
    font-size: 0.75em;
    width: 553px;
    height: 410px;
    padding: 25px 0 0 135px;
    top: 165px;
    left: 0;
    position: absolute;
}

#content #row-1 {
    float: left;
    width: 250px;
    margin-left: 15px;
}

#content #row-2 {
    width: 250px;
    float: right;
    margin-right: 15px;
}

Danke schonmal :)

(Ich hätte ja nie gedacht, dass ich mal im HTML-Forum um Rat fragen muss... :rtfm:)

Mau
 
Hi,

absolut positionierte Elemente sind nicht in der Lage, ihre Dimensionen (Breite und Höhe) an ihre Elternelemente zu übergeben.

Statt die Elemente absolut zu positionieren, solltest du sie zum Beispiel mit float anordnen. Die Höhe von content wird dann durch sein höchstes enthaltenes Element bestimmt - nicht mehr durch eine fest zugewiesene Höhe.

Ciao
Quaese
 
  • Gefällt mir
Reaktionen: mAu
Status
Nicht offen für weitere Antworten.
Zurück