Hallo,
ich möchte gerade für meine Webseite ein neues Design umsetzen. Es hat oben und unten einen Balken, über diesen Balken liegt ein Container. Der Container unten schließt nicht gerade ab, sondern hat eine leichte Wölbung. Bisher habe ich nur die beiden Balken hinbekommen. Mir fällt einfach nichts ein wie ich den Container realisieren kann.
Er soll unten und oben immer die gleiche Position haben, also über den Balken liegen. Der Mittelteil muss also streckbar sein. Übrigens sind unten und oben auch noch zwei Schatten. Ist es überhaupt möglich, sowas umzusetzen?
http://www.myimg.de/?img=howtoe52f0.jpg
Hier mein Quellcode:
Das andere habe ich verworfen, das hat einfach alles nicht hingehauen.
ich möchte gerade für meine Webseite ein neues Design umsetzen. Es hat oben und unten einen Balken, über diesen Balken liegt ein Container. Der Container unten schließt nicht gerade ab, sondern hat eine leichte Wölbung. Bisher habe ich nur die beiden Balken hinbekommen. Mir fällt einfach nichts ein wie ich den Container realisieren kann.
Er soll unten und oben immer die gleiche Position haben, also über den Balken liegen. Der Mittelteil muss also streckbar sein. Übrigens sind unten und oben auch noch zwei Schatten. Ist es überhaupt möglich, sowas umzusetzen?
http://www.myimg.de/?img=howtoe52f0.jpg
Hier mein Quellcode:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<link rel='stylesheet' href='styles/main.css' type='text/css' />
</HEAD>
<BODY>
<div id="background-top"></div>
</BODY>
</HTML>
Code:
html, body{
margin: 0;
padding: 0;
background: #fff url(../images/layout/background_bottom.gif) repeat-x bottom;
height: 100%;
}
#background-top{
background: #fff url(../images/layout/background_top.gif) repeat-x;
height: 304px;
}
Das andere habe ich verworfen, das hat einfach alles nicht hingehauen.