Avatar billede cdull Nybegynder
20. december 2007 - 21:58 Der er 3 kommentarer og
1 løsning

Centrering af body

Hey folkens. Hvordan får jeg nedenstående til at være centreret på hele min side ?
Jeg har prøvet lidt af hvert uden held. Derfor spørger jeg nu jer.


<body>
<div id="header">
    Header
</div>
<div class="colmask fullpage">
    <div class="col1">
    col1 col1
    </div>
</div>

<div id="footer">
  Foooooooter
</div>
</body>

//STYLESHEET
body {
margin:0;
padding:0;
font-size:90%;
border:solid 1px red;
width:1000px;
}
/* header styles */
#header {
clear:left;
float:left;
width:100%;
overflow:hidden;
border-bottom:4px solid #000;
}
.colmask {
clear:both;
float:left;
width:100%;
overflow:hidden;
}
/* common column settings */

.col1,
.col2,
.col3 {
float:left;
position:relative;
padding:.5em 0 1em 0;
overflow:hidden;
border:solid 2px blue;
}
/* Full page settings */
.fullpage {
background:#fff;       
}
.fullpage .col1 {
width:96%;               
left:2%;               
}
/* Footer styles */
#footer {
clear:both;
padding:1em 2%;
border-top:1px solid #ccc;
border:solid 2px green;
}
Avatar billede keysersoze Ekspert
20. december 2007 - 23:20 #1
css:

body {
margin:0;
padding:0;
font-size:90%;
border:solid 1px red;
}
/* header styles */
#content {
margin: auto;
width: 500px;
}
#header {
clear:left;
float:left;
width:100%;
overflow:hidden;
border-bottom:4px solid #000;
}
.colmask {
clear:both;
float:left;
width:100%;
overflow:hidden;
}
/* common column settings */

.col1,
.col2,
.col3 {
float:left;
position:relative;
padding:.5em 0 1em 0;
overflow:hidden;
border:solid 2px blue;
}
/* Full page settings */
.fullpage {
background:#fff;       
}
.fullpage .col1 {
width:96%;               
left:2%;               
}
/* Footer styles */
#footer {
clear:both;
padding:1em 2%;
border-top:1px solid #ccc;
border:solid 2px green;
}

html:

<body>
<div id="content">
<div id="header">
    Header
</div>
<div class="colmask fullpage">
    <div class="col1">
    col1 col1
    </div>
</div>

<div id="footer">
  Foooooooter
</div>
</div>
</body>

og sørg for at have en doctype på.
Avatar billede cdull Nybegynder
20. december 2007 - 23:38 #2
Jeg ved ikke om det er mig der fik forklaret mig lidt dårligt det med "hele siden", var nok lidt misvisende.
Bredden skal stadig være de her 1000px, men skal bare centreres på skærmen.

Ps. Bruger denne doctype, undlod bare at tage den med.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Avatar billede cdull Nybegynder
20. december 2007 - 23:40 #3
Sorry, der var jeg lidt for hurtig på aftrækkeren.
Det virker jo perfekt det du har lavet.

Jeg "glemte" at smide html delen ind, for jeg syntes den så ud som om at det var den samme.

Smid et svar. Tak for hjælpen.
Avatar billede keysersoze Ekspert
21. december 2007 - 07:47 #4
svar :)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester