Hallo,
ich habe folgendes "Konzept" für ein Layout (am besten in eine leere HTML-Datei kopieren - dann ist mein Problem besser verständlich):
Code:
<html>
<head>
<title>Layout</title>
<style>
#frame {
margin-top: 20px;
text-align: center;
width: 740px;
}
#headerLeft {
border: 1px #000000 solid;
float: left;
width: 348px;
}
#headerMiddle {
border: 1px #000000 solid;
float: left;
width: 38px;
}
#headerRight {
border: 1px #000000 solid;
float: left;
width: 348px;
clear: right;
}
#contentLeft {
border: 1px #000000 solid;
float: left;
width: 18px;
height: 300px;
}
#contentMiddle {
border: 1px #000000 solid;
float: left;
width: 698px;
height: 300px;
}
#contentRight {
border: 1px #000000 solid;
float: left;
width: 18px;
height: 300px;
clear: right;
}
#footerLeft {
border: 1px #000000 solid;
float: left;
width: 348px;
}
#footerMiddle {
border: 1px #000000 solid;
float: left;
width: 38px;
}
#footerRight {
border: 1px #000000 solid;
float: left;
width: 348px;
clear: right;
}
</style>
</head>
<body>
<div id="frame">
<div id="headerLeft">1</div>
<div id="headerMiddle">2</div>
<div id="headerRight">3</div>
<div id="contentLeft">4</div>
<div id="contentMiddle">5</div>
<div id="contentRight">6</div>
<div id="footerLeft">7</div>
<div id="footerMiddle">8</div>
<div id="footerRight">9</div>
</div>
</body>
</html>
Soweit sogut - nur möchte ich dem Layout allerdings noch eine dynamische Breite und Höhe geben.
Beispiel:
Bereich 5 (contentMiddle) ist der Bereich in dem später der Inhalt der Seite stehen soll. Grundsätzlich soll das Layout 740 Pixel breit sein - wenn in diesem Bereich Nr. 5 aber nun z.B. ein großes Bild eingefügt wird soll sich das Layout automatisch an dessen Größe anpassen.
- Wenn das Bild breiter ist sollen die Bereiche 2 (headerMiddle), 5 (contentMiddle) und 8 (footerMiddle) breiter werden - alle anderen Bereiche sollen allerdings die gleiche Breite behalten.
- Wenn das Bild höher wird soll sich nur Bereich 4 (contentLeft), 5 (contentMiddle) und 6 (contentRight) anpassen.
Wie muss ich das Layout ändern dass die bestimmten Bereiche dynamisch die Größe verändern können, andere Bereich allerdings _immer_ die selber Größe behalten?
Vielen Dank im voraus,
altes-kind