Store forskjeller i siden utseende fra browser til browser

[moneymaker]

Holder på med ei jalla-side jeg bare setter opp fordi jeg kjeder meg litt (har et litt random domene som hoveddomene på servern min)..

Nuhvel, problemet er at siden vises vidt forskjellig i Crome, IE og Firefox. Har sett små forskjeller før og, på andre sider jeg har laget, men her får man faktisk 3 forskjellige varianter av siden. Noen som har et forslag til hvorfor dette skjer?

Kavring | om nom nom

 

[leisegang]

anbefaler å skrive en CSS med tanke på 3 nettlesere. det er en del koder som er forskjelige. og anbefaler å kjøre en CSS reset i begynnelsen slik at det er faktisk DIN css som bestemmer og ikke nettleseren sin "default" oppsett som bestemmer.

 

[kek91]

Aldri har jeg sett noen så dedikert og hengiven til kavring

 

[adeneo]

Jeg ville nok begynt med å slutte å bruke <center> tagger ettersom det ikke finnes slike tagger i HTML5, som er den valgte doctype'n, og det er ugyldig kode og sannsynligvis hovedårsaken til at siden vises forskjellig ettersom nettleserene prøver å gjette hva du tenkte på da du valgte å bruke en tagg som utgikk i forrige århundre i HTML5.

Ellers enig med leisegang at en CSS reset alltid er en god ide, og jeg anbefaler denne for generelt bruk i HTML5 :

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
body {
    line-height:1;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}
nav ul {
    list-style:none;
}
blockquote, q {
    quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}
a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
/* endre farge til det som passer */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}
/* endre farge til det som passer */
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}
del {
    text-decoration: line-through;
}
abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}
table {
    border-collapse:collapse;
    border-spacing:0;
}
/* endre border farge til det som passer */
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}
input, select {
    vertical-align:middle;
}

 

[moneymaker]

Limer jeg bare den koden inn i style? Jeg er ikke så veldig stødig i denne kodinga altså, så er det noe annet jeg kan bruke enn center uten at jeg må lage en egen kode for adsense-biten.

 

[adeneo]

CSS reset'en settes inn øvert i CSS filen din for å nulle ut en del stiler for å gjøre det mer jevnt mellom nettlesere, og lette utformingen av stiler senere.

I stedet for <center> taggen kan du bruke "margin: 0 auto" i CSS, bare husk å sette posisjonen til relativ.

 

[leisegang]

Var på mobil så fikk ikke kopiert inn css

Takk @adeneo