Verschil tussen Chrome en Explorer

Beste One2xsers,
Ik ben een probleem tegen gekomen dat ik zowel met html en css niet kan oplossen. Ik ben een site aan het maken en controleer telkens of Chrome en Explorer een verschillend resultaat laten zien.
Ik ben vol verbazing dit verschil tegen gekomen:

Bovenste is Chrome: Je ziet dat de statusbar bovenaan de pagina de tekst links zet terwijl ik de eis stel dat hij in het midden moet komen.
Onderste is Explorer: Je ziet dat Explorer hem wel in het midden plaatst. Dat moet Chrome ook doen.

Index.html

<head>
        <link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<!-- Status bar -->
            <div class="statusbar">
                <p class="stats">
                Online Players: <font color="green">201</font>    &nbsp;&nbsp;&nbsp;-&nbsp;&nbsp;
                <u>Login:</u> <font color="green">On</font>            &nbsp;&nbsp;&nbsp;-&nbsp;&nbsp;
                <u>World:</u> <font color="red">Off</font>                &nbsp;&nbsp;&nbsp;-&nbsp;&nbsp;
                <u>Game:</u> <font color="green">On</font></p>
            </div>
</body>

Style.css

/*Statusbar*/
            div.statusbar{
                width: 100%;
                height: 63px;
                text-align: center;
                background-image: url(stat1.png);
            }
            p.stats{
                width: 440px;
                height: 63px;
                text-align: center;
                color: #ffffff;
                background-image: url(stat2.png);
                font-size: 16px;
                }

Er staat duidelijk in de css twee keer: text-align:center;
Waarom weigert hij te centreren?
Aub hulp!

Ik weet niet hoe dit precies komt..

maargoed dit is een fix.

p.stats{
                width: 440px;
                height: 63px;
                text-align: center;
                color: #ffffff;
                background-image: url(stat2.png);
                font-size: 16px;
        margin-left: auto;
        margin-right: auto;
             }

heb getest.

Justafool GENIAAL BEDANKT! Het werkt! Geen idee waarom hij het niet deed, maar dit werkt wel!

Nu heb ik nog een vraagje, hoe krijg k het nu voor elkaar dat hij de woorden verticaal ook centreerd? Vertical-align: center; & Vertical-align: middle; werken niet.

Dit kan je doen met padding top: 5px;

5px moet je even mee spelen tot hij goed staat

Dit kan je doen met padding"“top: 5px;

5px moet je even mee spelen tot hij goed staat.

Sorry van dubbelpost weet niet hoe te kwam vast foutje gemaakt met mobiel

Alweer een goed antwoord en een goed resultaat! Je bent geweldig! Nog een vraagje:
Wat moet one2xs zonder jou?
Je bent geweldig!

Ik had een hekel aan de padding te gebruiken omdat ik een paar dagen geleden problemen had met het feit dat Chrome de padding ook de backgroundimage lied verplaatsen, maar hiermee werkt het wel prima

tip: als padding gebruik zet dan altijd ook margin in je div-id en zet die op 0, dan verplaatst je image niet

Spyrose schreef:

Alweer een goed antwoord en een goed resultaat! Je bent geweldig!

Nog een vraagje:
Wat moet one2xs zonder jou?
Je bent geweldig!

Ik had een hekel aan de padding te gebruiken omdat ik een paar dagen geleden problemen had met het feit dat Chrome de padding ook de backgroundimage lied verplaatsen, maar hiermee werkt het wel prima .

Haha geen probleemen gebruik Indd de tip van marjolein ook nog.

veel succes verder als je nog hulp nodig hebt kan je met ook altijd pmen

Thanks marjolein, dat verklaard ook waarom het niet werkte toen ik het probeerde, nu kan ik het ook oplossen. Justafool ik stuur je vanavond even een mailtje als ik meer tijd heb. Bedankt dat je wilt helpen!