Position af billeder
Hej, jeg er ret ny til CSS, mit problem er at jeg har lavet et logo jeg har delt i 5 billeder, disse 5 billeder skulle så gerne samles i et igen på min side 2 billeder øverst og 3 billeder nederst, de skal stå i en ramme på 800px som er centeret på selve siden, dette er hvad jeg er nået frem til indtil vidre, kan ikke får dem til at stå rigtigt ved brug af div.På min side http://www.clandisa.dk/testside/ står de rigtigt men ved brug af table dette ville jeg gerne til at undgå fremover.
HTML KODEN:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html dir='ltr' lang='da'>
<head>
<link href="css/style.css" rel="stylesheet" type="text/css">
<link rel="alternate stylesheet" type="text/css" media="screen" title="blaa" href="css/style1.css">
<link rel="alternate stylesheet" type="text/css" media="screen" title="brun" href="css/style2.css">
<script src="css/styleswitch.js" type="text/javascript"></script>
<title>Christiansens Hjemmeside</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="description" content="Her finder du information om familie Christiansen og deres firmaer">
<meta name="keywords" content="Thailand, Familiebilleder, Rengøring">
<meta name="title" content="Christiansens Hjemmeside">
<meta name="robots" content="noindex,nofollow">
<meta name="revisit-after" content="90">
<meta name="author" content="Per Christiansen">
<meta name="copyright" content="Per & Wirawan Christiansen">
<meta http-equiv="expires" content="sat, 1 jan 2050 00:00:00 gmt">
<meta http-equiv="Content-Language" content="DK">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="cache-control" content="no-store">
</head>
<BODY>
<center>
<div id="header">
<div id="top_left"></div>
<div id="top_right"></div>
<div id="banner_left"></div>
<div id="banner_center"></div>
<div id="banner_right"></div>
</div></center>
</body>
</html>
CSS KODEN: (Højde og bredde passer til billederne)
body {
width:800px;
margin:0 auto;
margin-top:50px;
padding:0;
background-color:#FFFFFF;
background-image: url("../images/styles/styles/body_background.jpg");
background-repeat:repeat-x;
}
#header {
width:800px;
height:230px;
background-color:#FFAA00;
background-image: url("");
background-repeat: no-repeat;
border:1px solid #000000
}
/* Position for alle billeder i banner systemet */
/* background-image: url(../); width:px; height:px; */
#top_left {position:absolute; background-image: url(../images/banner_top_left.gif); width:329px; height:48px; margin-top:0px; margin-right:0px; margin-bottom:0px; margin-left:0px;}
#banner_left {position:relative; background-image: url(../images/banner_left.jpg); width:329px; height:182px; top:48px; margin-top:0px; margin-right:0px; margin-bottom:0px; margin-left:0px;}
#top_right {position:absolute; background-image: url(../images/banner_top_right.gif); width:471px; height:48px; margin-top:0px; margin-right:0px; margin-bottom:0px; margin-left:329px;}
#banner_center {position:relative; background-image: url(../images/banner_center.jpg); width:183px; height:182px; top:48px; margin-top:-182px; margin-right:0px; margin-bottom:0px; margin-left:329px;}
#banner_right {position:relative; background-image: url(../images/banner_right.jpg); width:288px; height:182px; top:48px; margin-top:-182px; margin-right:0px; margin-bottom:0px; margin-left:512px;}
