[css]margin in firefox wordt bij width opgeteld?

[Rowanov]

Hallo. Bij het maken van een website, in een poging eindelijk eens css te leren, heb ik volgende pagina gemaakt: Klik!. Ik loop nu tegen het probleem op dat als ik een bij een div de breedte en de margin instel dat hij Firefox breder wordt weergegeven. Het lijkt alsof de ingestelde margin bij de breedte wprd opgeteld, dat heb ik getest door de margin te verhogen en dan veranderde de breedte van de div idd zichtbaar. Dit alles werkt in IE wel gewoon. Mijn vraag is dan ook of hier een workaround voor is.

Dit is de betreffende css:

code:

div
{
  background: #ebebeb url(index/left.gif) repeat-y fixed left bottom;
  border: 1px solid #391A0E;
  border-width: 0 1px;
  margin: 0 auto;
  padding: 20px 10px 10px 20px;
  position: relative;
  width: 790px;
}

Wat ik ook wel vreemd vind is dat mijn site in Firefox netjes gecentreerd wordt en in IE niet.

Als de layout je bekend voorkomt, dat kan kloppen want die komt van A List Apart van een artikel waar werd uitgelegd hoe je css/js kon gebruiken in plaats van frames.

[Blaise]

Het is de padding die wordt opgeteld. Margin niet.

Het is trouwens slimmer om de breedte ongeveer 770px te doen IVM scrollbars als je meer content hebt.

Probeer dit eens:

code:

div
{
  background: #ebebeb url(index/left.gif) repeat-y fixed left bottom;
  border: 1px solid #391A0E;
  border-width: 0 1px;
  margin: 0 0 0 -395;
  padding: 20px 0 10px;
  position: relative;
  left: 50%;
  width: 790px;
}

De "padding" doe je dan door de elementen in die div een margin mee te geven.

[ Voor 83% gewijzigd door Blaise op 16-10-2004 20:50 ]

[Rowanov]

Het werkt nu idd perfect, ook heel erg bedankt voor het centreer probleempje.
Nog even voor de search, ik heb de code uit de vorige reply gebruikt en die werkte correct.