Hur centrerar jag hela sidan? .. (nybörjare)
Hejsan.. igen (;
Nu har jag en liten till fråga..
Hur centerar jag hela sidan så den stannar i mitten på browsern?
Min html kod är:
<!-- this sets the doc type -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>:: Computer And Electricity Services ::</title>
<!-- linking your stylesheet document -->
<link rel="stylesheet" type="text/css" href= "styles.css" media="screen">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css">
<!--
-->
</style>
</head>
<body>
<div id="main">
<div id="header"></div>
<div id="about"></div>
<div id="aboutbutton"><a href="omoss.html"><img src="images/icon_about.png" alt="Läs mer om företaget" width="98" height="27" border="0"></a></div>
<div id="nav"><img src="images/nav_devider.png" width="2" height="35"><img src="images/icon_home_marked.png" alt="Startsida" width="66" height="35" border="0"><img src="images/nav_devider.png" width="2" height="35"><a href="service.html"><img src="images/icon_services.png" alt="Service" width="78" height="35" border="0"></a><img src="images/nav_devider.png" width="2" height="35"><a href="policy.html"><img src="images/icon_policy.png" alt="Policy" width="95" height="35" border="0"></a><img src="images/nav_devider.png" width="2" height="35"><a href="kopvilkor.html"><img src="images/icon_kopvilkor.png" alt="Köpvilkor" width="95" height="35" border="0"></a><img src="images/nav_devider.png" width="2" height="35"><a href="jobb.html"><img src="images/icon_work.png" alt="Vill du jobba hos oss?" width="78" height="35" border="0"></a><img src="images/nav_devider.png" width="2" height="35"><a href="kontaktaoss.html"><img src="images/icon_contact.png" alt="Kontaktuppgifter" width="110" height="35" border="0"></a><img src="images/nav_devider.png" width="2" height="35"></div>
<div id="green"></div>
</div>
<div id="leftcontent"></div>
<div id="middlecontent">TEST TEXT!</div>
<div id="rightcontent"></div>
<div id="reklam"></div>
<div id="footer"></div>
</body>
</html>
Sen har vi min CSS:
#body
{
margin:0px;
padding:0px;
background-image: url(images/cesbg.png);
background-repeat: repeat;
Font-family:Verdana, Arial, Helvetica, sans-serif;
}
#main
{
background:url(images/header_bg.png);
background-repeat:repeat-x;
border-right:solid 1px;
height:239px;
width:1200px;
position:absolute;
top:0px;
left:0px;
}
#header
{
background:url(images/header_title.png);
background-repeat:no-repeat;
width:478px;
height:239px;
position:absolute;
left:90px;
}
#about
{
background:url(images/foretagsbeskrivning.png);
width:465px;
height:157px;
position:absolute;
left: 637px;
top: 30px;
}
#aboutbutton
{
width:98px;
height:27px;
position:absolute;
left: 964px;
top: 187px;
}
#nav
{
background:url(images/nav_bg.png);
background-repeat:repeat-x;
border-right:solid 1px;
width:1200px;
height:35px;
position:relative;
left:0px;
top:239px;
padding-left:130px;
}
#green
{
background:url(images/green_nav.png);
border-right:solid 1px;
width:1200px;
height:36px;
position:absolute;
left:0px;
top:274px;
}
#leftcontent
{
background:url(images/contet_left.png);
background-repeat:no-repeat;
width:56px;
height:1028px;
position:absolute;
left:0px;
top:310px;
}
#middlecontent
{
background:url(images/contet_middle.png);
background-repeat:repeat-x;
width:1115px;
height:1028px;
position:absolute;
left:56px;
top:310px;
}
#reklam
{
background:url(images/reklam.png);
width:267px;
height:956px;
position:absolute;
left:897px;
top:346px;
}
#rightcontent
{
background:url(images/content_right.png);
border-right:solid 1px;
width:29px;
height:1028px;
position:absolute;
left:1171px;
top:310px;
}
#footer
{
background:url(images/footer.png);
border-right:solid 1px;
width:1200px;
height:162px;
position:absolute;
left:0px;
top:1338px;
}
Som ni ser så har jag byggt hela hemsidan med divs.
Tack på förhand!
mvh affe
