Hilfe bei 3 Spalten Layout

Hallo,

ich hänge schon seit gewiss 5 Stunden an folgendem Problem. Vorweg: Ich habe mir schon einige Beiträge durchgelesen und gegoogelt wie ein weltmeister. Leider ohne erfolg. Ich hoffe Ihr könnt mir helfen.

Ich möchte ein drei Spalten Layout erstellen, wobei die beiden äußeren Spalten keinen Inhalt besitzen, sondern nur als Schattenrand dienen. In der mittleren Spalte soll der Inhalt erscheinen. Das ganze soll eine Höhe von 100% haben. Nun habe ich das Problem, dass die Schattenspalten nicht angezeigt werden. Hat jemand eine Idee?

Hier mein HTML Code

    Inhalt

    </div>

<div id="clear"></div>
</div>

und der css code:

html {
height: 100%;
}

body {
background-image:url(‚images/background.jpg‘);
background-repeat: repeat-x;
background-attachment: fixed;
margin: 0px;
text-align:center;
height: 100%;
}

#page {
margin:0px auto;
width: 820px;
min-height: 100%;
height: auto !important;
height: 100%;
}

#shadow-page-left {
float: left;
width: 10px;
margin: 0px;
height: 100%;
background-image:url(‚images/shadow-left.png‘);
background-repeat: repeat-y;
}

#shadow-page-right {
float: right;
width: 10px;
margin: 0px;
height: 100%;
background-image:url(‚images/shadow-right.png‘);
background-repeat: repeat-y;
}

#content {
min-height: 100%;
height: 100%;
margin: 0px auto;
width: 700px;
background-color: #ffffff;
text-align: left;
padding: 25px 50px;
}

#clear {
clear: both;
}

Lass mal das „margin: 0px auto;“ beim #content weg.

Lass mal das „margin: 0px auto;“ beim #content weg.
das hat leider gar nichts gebracht. das sagt dem content doch auch nur das er in er mitte des #page divs sein soll. seltsamer weiße funktioniert das ganze mit festen höhenangaben, sprich bspw. 1000px. dann wird halt genau 1000px schatten angezeigt. aber das kann ich nicht gebrauchen. ich benötige eine höhe von 100%.

Hast Du einen Link zur Seite?

Hast Du einen Link zur Seite?

Habs grad mal hochgeladen. Vielleicht findest du den Fehler ja. Problemseite

Entferne min-height auf #page und setze height dort auf 100%. Klappt in meinem Firebug problemlos.

wenn ich min-height und height: auto !important; entferne dann wird zwar der schatten angezeigt, jedoch nur für genau eine seitenhöhe, wenn der inhalt größer ist und man runter scrollt, hört der schatten quasi auf halber strecke auf, ebenso der hintergrund von #page.

Mmh, merkwürdig. Gib der linken und rechten Spalte mal noch einen Inhalte, also nur ein geschütztes Leerzeichen und probiere nochmal die height-Werte zu variieren. Theoretisch ist es korrekt, wenn alle height-Werte auf dem Web im DOM von html zu den Spalten 100% betragen.