centreren van webpagina

Status
Niet open voor verdere reacties.

dirkandries

Gebruiker
Lid geworden
8 jul 2008
Berichten
190
ik ben bezig met een website je maar elke keer als ik me website bekijk dan zit hij helemaal tegen de linker kant aan geplakt
dit is mijn html
Code:
<!DOCTYPE html>
<html lang="nl">
<head>
<title>rekenmachine</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="rekenmachine.css" rel="stylesheet" type="text/css">
</head>
<body>
<!-- begin tabel 1 -->
<div id="Tabel_01">
    <div id="rekenmachine-01">
    </div>
    <div id="mijnx20rekenmachine">
    </div>
    <div id="rekenmachine-03">
    </div>
    <div id="rekenmachine-04">
    </div>
    <div id="rekenmachine-05">
    </div>
    <div id="rekenmachine-06">
    </div>
    <div id="rekenmachine-07">
    </div>
    <div id="rekenmachine-10">
    </div>
    <div id="rekenmachine-13">
    </div>
    <div id="rekenmachine-14">
    </div>
    <div id="rekenmachine-15">
    </div>
    <div id="id1">
            <p>&nbsp;</p>
            <h1>Dit is de home page van mijn site</h1>
            <h2>deze site is voor het omreken van binair met decimaal en euro met dollar</h2>
    </div>
    <div id="rekenmachine-17">
    </div>
    <!-- home koppeling-->
    <div id="home"> <a href="home.html"><img src="images/home.jpg" width="84" height="31" alt="" /></a>
    </div>
    <!-- bainair-decimaal koppeling -->
    <div id="binair-decimaal"> <a href="binair-decimaal.html"><img src="images/binair-decimaal.jpg" width="111" height="31" alt="" /></a>
    </div>
    <!-- euro-dollar koppeling-->
    <div id="euro-dollar"> <a href="euro-dollar.html"><img src="images/euro-dollar.jpg" width="104" height="31" alt="" /></a>
    </div>
    <!-- de makers koppeling-->
    <div id="dex20makers"> <a href="de makers.html"><img src="images/de-makers.jpg" width="91" height="31" alt="" /></a>
    </div>
    <!-- einde tabel 1 -->
</div>
</body>
</html>

en dit me css
Code:
<style type="text/css">

body {
margin:0;
padding:0;
} 

#Tabel_01 {
width:1000px;
margin:0 auto;
padding:0;
} 
 


#rekenmachine-01 {
    position:absolute;
    left:0px;
    top:0px;
    width:130px;
    height:850px;
    background:url(images/rekenmachine_01.jpg)
}

#mijnx20rekenmachine {
    position:absolute;
    left:113px;
    top:0px;
    width:450px;
    height:106px;
    background:url(images/mijn-rekenmachine.jpg)
}

#rekenmachine-03 {
    position:absolute;
    left:563px;
    top:0px;
    width:53px;
    height:106px;
    background:url(images/rekenmachine_03.jpg)
}

#rekenmachine-04 {
    position:absolute;
    left:616px;
    top:0px;
    width:130px;
    height:106px;
    background:url(images/rekenmachine_04.jpg)
}

#rekenmachine-05 {
    position:absolute;
    left:746px;
    top:0px;
    width:149px;
    height:106px;
    background:url(images/rekenmachine_05.jpg)
}

#rekenmachine-06 {
    position:absolute;
    left:895px;
    top:0px;
    width:130px;
    height:849px;
    background:url(images/rekenmachine_06.jpg)
}

#rekenmachine-07 {
    position:absolute;
    left:113px;
    top:106px;
    width:1px;
    height:31px;
    background:url(images/rekenmachine_07.jpg)
}

#home {
    position:absolute;
    left:114px;
    top:106px;
    width:84px;
    height:31px;
}

#binair-decimaal {
    position:absolute;
    left:198px;
    top:106px;
    width:111px;
    height:31px;
}

#rekenmachine-10 {
    position:absolute;
    left:309px;
    top:106px;
    width:1px;
    height:31px;
    background:url(images/rekenmachine_10.jpg)
}

#euro-dollar {
    position:absolute;
    left:310px;
    top:106px;
    width:104px;
    height:31px;
}

#dex20makers {
    position:absolute;
    left:414px;
    top:106px;
    width:91px;
    height:31px;
}

#rekenmachine-13 {
    position:absolute;
    left:505px;
    top:106px;
    width:390px;
    height:31px;
    background:url(images/rekenmachine_13.jpg)
}

#rekenmachine-14 {
    position:absolute;
    left:113px;
    top:137px;
    width:782px;
    height:43px;
    background:url(images/rekenmachine_14.jpg)
}

#rekenmachine-15 {
    position:absolute;
    left:113px;
    top:180px;
    width:1px;
    height:670px;
    background:url url(images/rekenmachine_15.jpg)
}

#id1 {
    position:absolute;
    left:114px;
    top:180px;
    width:781px;
    height:670px; 
    background:url(images/1.jpg)
    
}


#rekenmachine-17 {
    position:absolute;
    left:895px;
    top:849px;
    width:109px;
    height:1px;
    background:url(images/rekenmachine_17.jpg)
}

h1 {
font-size: 28px;
line-height: 44px;
padding-top: 22px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 200px;
}

h2 {
font-size: 16px;
line-height: 44px;
padding-top: 5px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 140px;
}
</style>
 
In IE moet je een kleine omweg nemen;) in de rest moet margin:0 auto werken;)

Code:
#Tabel_01 {
width:1000px;
margin:auto 0;
padding:0;
text-align:left;
} 

body {
margin:0;
padding:0;
text-align:center;
}

Zo zou het moeten werken
 
Status
Niet open voor verdere reacties.

Nieuwste berichten

Terug
Bovenaan Onderaan