joniversal: links und rechts balken bündig an wrapper

Beitrag lesen

SELF-Forum

links und rechts balken bündig an wrapper

joniversal
– Informationen zu den Bewertungsregeln

hallo liebe leute,

ich bau gerade meine erste website und komm jetzt nicht mehr um ein aufgeschobenes problem drumrum.

die wesentlichen elemente sind:

header (grau)
footer (orange)
senkrechte balken bzw. shadow_left, shadow_right (grün)

so sieht es zur zeit aus:
[url=http://www.fotos-hochladen.net][img]http://img5.fotos-hochladen.net/uploads/balken1j5ayr3edq7.jpg[/img][/url]

die grünen balken (shadow_left und shadow_right) sollen aber bündig links und rechts am header bzw. footer anliegen. so wie hier:

[url=http://www.fotos-hochladen.net][img]http://img5.fotos-hochladen.net/uploads/balken2k1432ixful.jpg[/img][/url]

die css sieht so aus:

html,

body {
margin:0;
padding:0;
height:100%;
}

#wrapper {
min-height:100%;
position:relative;

margin-right:auto;

margin-left:auto;
width:1060px;
}

#shadow_left {
/* background-image:url(Slices/Bilder/PORTFOLIO_LAYOUT_2_03-03.jpg); */
background-repeat:repeat;
width: 50px;
min-height:100%;
float: left;
background-color:#0C0;
}

#shadow_right {
/* background-image:url(Slices/Bilder/PORTFOLIO_LAYOUT_2_05.jpg); */
background-repeat:repeat;
width: 50px;
min-height:100%;
float: right;
background-color:#0C0;
}

#header {
background:#ededed;
padding:10px;
}

#content {
padding-bottom:100px; /* Height of the footer element */
}

#footer {
background:#ffab62;
width:100%;
height:100px;
position:absolute;
bottom:0;
left:0;
}

und die html so:

</head>

<body>

<div id="shadow_left"> </div>
 <div id="shadow_right"> </div>

<div id="wrapper">  

	  
	<div id="header">  
	</div><!-- #header -->  

	  
	<div id="content">  
	</div><!-- #content -->  

	  
	<div id="footer">  
	</div><!-- #footer -->  
	  
</div><!-- #wrapper -->

</body>

</html>

ich hab gar keine idee mehr wie man die beiden grünen-shadowbalken bündig an den wrapper bekommt.
ich würd mich freuen wenn einer von euch eine lösung parat hat.

vielen lieben dank schonmal.

Beitrag melden
–
Informationen zu den Bewertungsregeln