Chris: XHTML mit 4 Spalten und 3 Zeilen

Beitrag lesen

Oh Sorry total vergessen.

  
<!DOCTYPE html  
  PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/DE"  
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  
<html xmlns="http://www.w3.org/1999/xhtml"  
  xml:lang="de" lang="de">  
  
<html>  
<head>  
<link href="style.css" rel="stylesheet" type="text/css" />  
</head>  
<body>  
  
<!--header start -->  
<div id="header">  
  <div class="left"></div>  
  <div class="eye"></div>  
  <div class="center"></div>  
  <div class="right"></div>  
 </div>  
<!--header end -->  
  
<!--header start -->  
<div id="middle">  
  <div class="eye"></div>  
  <div class="center"></div>  
  <div class="fill"></div>  
 </div>  
  
 <div id="bottom">  
  <div class="left"></div>  
   <div class="eye"></div>  
    <div class="right"></div>  
</div>  
  
  
</body>  
</html>
/* CSS Document */  
  
body{  
	padding:0;  
	margin:0;  
	color:#000000;  
background-color:#000;  
}  
div, h1, h2, p, form, label, input, textarea, img, span{  
	margin:0; padding:0;  
}  
  
ul{  
	margin:0;  
	padding:0;  
	list-style-type:none;  
}  
.spacer{  
	clear:both;  
	font-size:0px;  
	line-height:0px;  
}  
/*------------------------------------------------body---------------------*/  
  
#header{  
	width:1440px;  
	height:368px;  
	background-color:#000;  
	padding:0 0 0 0;  
	margin:0 auto;  
	position:relative;  
}  
  
#header div.left{  
	width:250px;  
	height:926px;  
	background:url(images/bg_top_left.jpg) 0 0 no-repeat;  
	padding:0 0 0 0;  
	margin:0 auto;  
	float:left;  
	position:relative;  
	  
}  
  
#header div.eye{  
	width:290px;  
	height:368px;  
	background:url(images/bg_top_eye.jpg) 0 0 no-repeat;  
	padding:0 0 0 0;  
	margin:0 auto;  
	float:left;  
	position:relative;  
}  
  
#header div.center{  
	width:530px;  
	height:368px;  
	background:url(images/bg_top_center.jpg) 0 0 no-repeat;  
	padding:0 0 0 0;  
	margin:0 auto;  
	float:left;  
	position:relative;  
}  
  
#header div.right{  
	width:370px;  
	height:926px;  
	background:url(images/bg_top_right.jpg) 0 0 no-repeat;  
	padding:0 0 0 0;  
	margin:0 auto;  
	float:right;  
	position:relative;  
}  
  
  
#middle {  
	width:100%;  
	height:100%;  
	padding:0 0 0 0;  
	margin:0 0;  
	position:relative;  
}  
  
#middle div.eye{  
	width:121px;  
	height:478px;  
	background:url(images/bg_middle_eye.jpg) 0 0 no-repeat;  
	padding:0 0 0 0;  
	margin:0 0;  
	float:left;  
	position:relative;  
}  
  
#middle div.center{  
	width:699px;  
	background:url(images/bg_middle_center.jpg) 0 0 repeat-y;  
	padding:0 0 0 0;  
	margin:0 0;  
	float:left;  
	position:relative;  
}  
  
  
  
#bottom {  
	width:371px;  
	height:255px;  
	background:url(images/bg_bottom_left.jpg) 0 0 repeat-y;  
	padding:0 0 0 0;  
	margin:0 auto;  
	float:left;  
	clear:both;  
}  
  
#bottom div.left{  
	width:250px;  
	height:255px;  
	background:url(images/bg_bottom_left.jpg) 0 0 repeat-y;  
	padding:0 0 0 0;  
	margin:0 0;  
	float:left;  
}  
  
#bottom div.eye{  
	width:121px;  
	height:255px;  
	background:url(images/bg_bottom_eye.jpg) 0 0 repeat-y;  
	padding:0 0 0 0;  
	margin:0 0;  
	float:left;  
}