Har du provat med
.header {
position: relative;
width: 760px;
height: 120px;
background-image: url(gfx/header_back.png);
margin: 0px auto;
}
i stället för din nuvarande? Det kanske kan fungera bättre..?
11 svar · 329 visningar · startad av kris
jag använder följande css för att centrera en divbox.
body {
margin: 0px;
padding: 0px;
background-image: url(gfx/back_row.png);
background-position: center;
background-repeat: repeat-y;
text-align: center;
}
#header {
position: relative;
width: 760px;
height: 120px;
background-image: url(gfx/header_back.png);
margin: 0px auto;
}
problemet är att headerboxen ligger en pixel för långt åt vänster i explorer, och passar då inte ihop med bakgrundsbilden i bodyn. jag lyckas inte få till det här på något vettigt sätt.
/kris
Har du provat med
.header {
position: relative;
width: 760px;
height: 120px;
background-image: url(gfx/header_back.png);
margin: 0px auto;
}
i stället för din nuvarande? Det kanske kan fungera bättre..?
ingen skillnad...
I så fall vet jag ej lösningen på problemet. :(
Har du testat med olika värden på width? I slutändan kanske du får ändra på bakgrundsbilden.. :(
Vad använder du för <Doctype ?
Testa att sätta bredden på body, ex:
[red]html, body {
width: 100%;
margin: 0;
padding: 0;
background: url(gfx/back_row.png) repeat-y 50% 50%;
text-align: center;
}[/red]
Det är inte så att den ena bakgrundsbilden är ett jämnt antal pixlar bred och den andra är ett udda antal pixlar bred?
Kontrollera det, och plocka bort/lägg till en kolumn pixlar om det behövs.
doctype:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
jag har lyckats lösa det med att sätta bredden på header till 759.5px. då ser det likadant ut i både explorer och firebird.
bredden på de båda bilderna är båda 760px.
Hmm.. men det måste ju vara något som strular till det, så där ska du inte behöva göra.
Ligger sidan online så man kan få ta sig en titt?
du kan kika på den här:
http://www.theflamingmoes.net/nytfm/
Aha, nu hänger jag med på vad det är du menar. :e
Det beror på att du har bakgrundsbilden liggandes i bodyn,
flyttar du över den till #main så slipper du problemet.
Du har ju redan en div som heter main, så använd den.
ex.
[red]...
body {
height: 101%;
margin: 0px;
padding: 0px;
text-align: center;
}
#main {
width: 760px;
height: 101%;
margin: 0 auto;
background: url([url]http://www.theflamingmoes.net/nytfm/gfx/back_row.png[/url]) repeat-y;
}
...[/red]
sådärja! det tackar jag så hemskt mycket för! :)
np! :bire