Hej!
Jag har klurat och klurat men inte riktigt fått ordning på min CSS-kod. Det jag vill åstadkomma är en HEADER-, MENU-, CONTENT- och FOOTER-del (enligt bifogad bild).
Jag vill att "hela paketet" skall vara positionerat jämt med vänsterkanten. Nu finns det ett vitt mellanrum både till vänster och högst upp. Hur löser jag detta så att de vita kanterna försvinner i css-koden? Följande kod använder jag nu.
#header
{
position: relative;
top: 0px;
left: 0px;
width: 770px;
height: 200px;
border: 1px solid #000000;
background-color: #3379BA;
}
#footer
{
position: relative;
top: 0px;
width: 770px;
height: 100px;
border: black solid 1px;
border-top: black solid 0px;
background-color: #3379BA;
}
#menu
{
position: relative;
top: 0px;
left: 0px;
width: 770px;
height: 30px;
margin-left: 0px;
border: black solid 1px;
border-top: black solid 0px;
background-color: #3379BA;
}
#content
{
position: relative;
top: 0px;
left: 0px;
width: 770px;
height: 600px;
border: black solid 1px;
border-top: black solid 0px;
background-color: #3379BA;
padding: 0px;
}
<html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<head>
<title>XForum 1.0</title>
<link rel="stylesheet" href="objektmall3.css" type="text/css" />
</head>
<body>
<div id="header">HEADER</div>
<div id="menu">MENU</div>
<div id="content">CONTENT</div>
<div id="footer">FOOTER</div>
</body>
</html>
Någon som har några förslag?! :)
Mvh,
Fredrik
icaaqMedlem sedan okt. 20005 273 inlägg [red]
body
{
margin:0;
padding:0:
}
[/red]
mv icaaq
TypeMedlem sedan mars 20021 239 inlägg Kanske något sånt här:
html, body{
margin:0px;
padding:0px;
}
Det brukar jag skriva och det kan lösa liknande problem... sen vet jag inte.. jag har inte satt mig in i ditt problem riktigt men testa!
jarvkloMedlem sedan juli 20013 378 inlägg Hmm...
Tänk också på att position:absolute i själva verket positionerar relativt sitt "omgivande blocks" interna "koordinatsystem" och inte i förhållande till det koordinatsystem som begränsas av webbläsarfönstrets kanter!!!
Iofs blir det inte så stor skillnad när den ligger i <body> (förutom marginaler/padding då som påpekats ovan ;) ), men... Det är en viktig detalj!!
Rekommenderar denna nyskrivna artikel i ämnet CSS och positionering: http://www.autisticcuckoo.net/archive.php?id=2004/12/07/relatively-absolute
Det gjorde visst susen! Är inte marginalen per default satt till 0px? Tack för det snabba svaret iaf!
jarvkloMedlem sedan juli 20013 378 inlägg Hmm...
Defaulten är olika i MSIE och Mozillorna.
I den ena är marginalen 0 men inte paddingen och i den andra är det tvärtom...
Hursomhelst får du som resultat per default några pixlars indrag på innehållet i <body> om du inte gör något åt det ;)
icaaqMedlem sedan okt. 20005 273 inlägg Eftersom detta är ett svenskt forum skickar jag in den svenska varianten av jarvklo´s länk ;)
http://www.autisticcuckoo.net/arkiv.php?id=2004/12/07/relativt-absolut
mv icaaq
Tack för alla tips...e nybörjare på det här området och söker mig fram längs den krokiga stigen :)
Border-varianten "groove", jag får den ej att fungera i MSIE 6. Stödjer inte IE den varianten?
icaaqMedlem sedan okt. 20005 273 inlägg 