css/html not working on internet explorer but working on chrome and safari

Question

Is there any reason why this wouldnt work on internet explorer, but it works on google chrome and safari

body,html {
    min-width:600px;
    height:100%;
    margin:0;
    padding:0;
    font-family:Calibri;
    overflow:hidden;
}

here is a fiddle for my full code: http://jsfiddle.net/charliejsford/7a2uH/

EDIT: it seems to only be this part that is not working on IE

<header class="ex1">
        <div class="header-left"><img src="images/phone_icon.png" width="323" height="58" /></div>
        <div class="header-right">Shopping Basket</div>
        <div class="logo"><img src="images/logo" width="409" height="138" /></div>
    </header>

and then the CSS:

header {
    width: 100%;
    min-width: 800px;
    height: 160px;
    overflow: auto;
}
.ex1 .header-left {
    display:inline-block;
    width: 33%;
    max-width: 190px;
    float: left;
    margin:50px 0 0 70px;
}
.ex1 .logo {
    width: 409px; /* width of the logo */
    margin:10px auto 0 auto;
}
.ex1 .logo img {
    display: block;
}
.ex1 .header-right {
    display:inline-block;
    width: 33%;
    max-width: 190px;
    float: right;
    margin:50px 70px 0 0;
}

Answer 1

The <header> tag is supported in Internet Explorer 9+.