Hi, I have a problem centering a header thats in a div tag(HTML). It centers in my text editor, but when I upload it to the webhosting, and I view it live, its not centered. I've been going over it line for line, in both the html and the css for 2 weeks now, and no luck. Please help.

Here are lines of my html: <header> <h1>Baby Beatzz Countdown</h1> <div id="clockdiv"> <----THIS IS WHAT I'M TRYNA CENTER <div> <span class="days"></span> <div class="smalltext">Days</div> </div> <div> <span class="hours"></span> <div class="smalltext">Hours</div> </div> <div> <span class="minutes"></span> <div class="smalltext">Minutes</div> </div> <div> <span class="seconds"></span> <div class="smalltext">Seconds</div> </div> </div>

</header>

Lines Of my CSS:

clockdiv{

font-family: sans-serif;
color: #fff;
display: inline-block;
font-weight: 100px;
text-align: center;
font-size: 30px;

}

clockdiv > div{

padding: 10px;
border-radius: 3px;
display: inline-block;
text-align: center;

}

clockdiv div > span{

padding: 15px;
border-radius: 3px;
    display: inline-block;
    text-align: center;

}

.smalltext{ padding-top: 5px; font-size: 16px; text-align: center; }