Firefox CSS Toppmargen er ikke det samme som Chrome og IE
Hvis du har jobbet på nettstedet prøver å gjøre alt ser perfekt og senere oppdaget det ser sprø i en annen nettleser, er du ikke alene. Hva kan synes å være et ferdig mesterverk i Internet Explorer kan se ut som en komplett katastrofe i Firefox eller Chrome. Hvis sidene dine beste marginene ikke synes det samme på tvers av flere nettlesere, er det flere mulige årsaker til hvorfor - og løsninger du kan benytte for å løse det.
Cascading Style Sheets
Cascading Style Sheets lar deg endre elementer av en webside som font, farge eller marginer, med stil spesifikasjoner oftest plassert i en ekstern fil. Toppmargen egenskap - margin-top - etablerer den vertikale avstanden fra mellomrommet mellom toppen av vinduet og kroppen av websiden, og verdien kan angi lengde eller prosentandel, eller bruke "auto", standard nettleser . Som hver nettleser kan ha en annen standard toppmargen, kan toppmargen på nettstedet ditt gjengi litt forskjellig i hver enkelt.
Major Nettlesere
Ifølge NetMarketShare.com data, 54 prosent av folk bladde Internett ved hjelp av Internet Explorer i mars 2012. Firefox var andre på 21 prosent, og Chrome kom på tredjeplass på 19 prosent. Utviklere og designere hovedsakelig vurdere de tre nettleserne når du lager nettsider. Hvis Chrome og IE vise toppmargen som forventet, men Firefox ikke gjør det, kan du bruke CSS til å tilbakestille nettleserinnstillingene eller riktige leser uoverensstemmelser, slik at du kan style din toppmargen som du ønsker.
CSS Reset
En CSS Reset, også kjent som Reset CSS, kutt ned på nettleser inkonsekvenser, som kan finnes selv innenfor de ulike nettleserversjoner. I IE7, for eksempel standardtoppmargen for kroppen er 15 piksler; i IE8 og IE9, er det 8 piksler. Med en CSS Reset, du egentlig nulltoppmargen til null ved hjelp av noe som ligner på den generiske koden under:
{Margin-top: 0; padding: 0; }
Dette fjerner alle toppmarginnstillinger, slik at du kan definere din egen. Mange CSS Reset stilark eksisterer i det offentlige rom, og gir et eksempel hvis du ønsker å tilbakestille andre HTML-elementer på websiden.
Normalize.css
Et alternativ til en CSS Reset er å bruke Normalize.css, som er en åpen kildekode-CSS-fil du kan tilpasse for å gjøre nettlesere vise websideelementer på samme måte. I motsetning til en CSS Reset, betyr det ikke eliminere nettleserinnstillingene, men i stedet korrigerer leser uoverensstemmelser. Som i 2012 filen støtter alle de tre store nettlesere og inneholder kode for å rette HTML-elementer som kontrollerer elementer som blockdisplay, font-family inkonsekvens, marginer og mer.