Hallo!
Ich habe einen Container der "Page" heißt. Dieser soll 960px breit sein, und horizontal mittig ausgerichtet sein.
In diesem Container befinden sich weitere Container.
Unter anderem auch die Container "Menu" und "Content".
"Menu" ist links und soll einen grauen Hintergrund haben.
"Menu" soll mindestens so hoch sein dass das Menü komplett zu sehen ist.
Wenn der Container "Content" höher als das Menü ist soll der graue Hintergrund so hoch sein wie "Content"
"Content" ist rechts neben dem Menu und ist von der Höhe variable (je nach Textinhalt).
Hatte gedacht dass ich das Problem löse, in dem ich in den Container "Page" ein Hintergrundbild einbinde, das so breit ist wie der Container "Menu" und nach Y immer wieder wiederholt wird.
Im IE klappt das auch.
Im Firefox und im Opera wird der Hintergrund aber verschoben (hab euch mal einen Screenshot angehängt).
Hier der CSS Code:
Gruß
Christian
Ich habe einen Container der "Page" heißt. Dieser soll 960px breit sein, und horizontal mittig ausgerichtet sein.
In diesem Container befinden sich weitere Container.
Unter anderem auch die Container "Menu" und "Content".
"Menu" ist links und soll einen grauen Hintergrund haben.
"Menu" soll mindestens so hoch sein dass das Menü komplett zu sehen ist.
Wenn der Container "Content" höher als das Menü ist soll der graue Hintergrund so hoch sein wie "Content"
"Content" ist rechts neben dem Menu und ist von der Höhe variable (je nach Textinhalt).
Hatte gedacht dass ich das Problem löse, in dem ich in den Container "Page" ein Hintergrundbild einbinde, das so breit ist wie der Container "Menu" und nach Y immer wieder wiederholt wird.
Im IE klappt das auch.
Im Firefox und im Opera wird der Hintergrund aber verschoben (hab euch mal einen Screenshot angehängt).
Hier der CSS Code:
Code:
/*----------------------------
Allgemeine Position
----------------------------*/
#Page {
width: 960px;
background:#FFFFFF url('layout_images/menu_bg.gif') repeat-y fixed left top;
border: 1px solid #000000;
margin: 0px auto;
text-align: left;
}
/*----------------------------
Menu Eigenschaften
----------------------------*/
#Menu {
float: left;
width: 169px;
height: 100%;
background-color: #E3E3E3;
}
/*----------------------------
Content Position
----------------------------*/
#Content {
height: 100%; /* Muss bleiben, da sich sonst der Text verschiebt*/
padding: 10px;
margin-left: 170px;
}Gruß
Christian
