HTML:
Kod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link rel="stylesheet" href="css.css" />
</head>
<body>
<div id="main">
<div id="leftshadow"></div>
<div id="container">
CONTENT
</div>
<div id="rightshadow"></div>
</div>
</body>
</html>
CSS (döp filen till css.css)
Kod:
body, html{
height:100%;
margin:0;
}
#main{
margin:0 auto;
height:100%;
width:690px;
}
#container{
width: 640px;
height:100%;
background-color:blue;
float:left;
}
#leftshadow{
width:25px;
height:100%;
background:url(leftshadow.gif) right repeat-y;
background-color:green;
float:left;
}
#rightshadow{
width:25px;
height:100%;
background:url(rightshadow.gif) left repeat-y;
background-color:green;
float:left;
}
Skapa sen två gif bilder, leftshadow.gif(vänsterskugga) och rightshadow.gif (högerskugga).