Javascript-форум - Простая загвоздка с jqvery в IE

1.Index
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Demo</title>
<link rel="stylesheet" type="text/css" href="main_style.css"/>
</head>
<body>
<div id="cal">
<div id="all_events_big" >
<div class="red"></div>
<div class="black"></div>
<div class="white"></div>
</div>
<div id="that_event"></div>
<div id="all_events"></div>
</div>
<script src="jquery1.js"></script>
<script src="classList.js"></script>

<script type="text/javascript">
$("#all_events").click(function () {

$("#all_events_big").children().css({"width" : "10em","height": "10em"});
$("#all_events_big").css({"width" : "90%","height": "90%","top":"5%", "left":"5%"});

});

$("#all_events_big").children().click(function () {
if($(this).hasClass('red'))
{$("#that_event").css({"background" : "green"});}
if($(this).hasClass('black'))
{$("#that_event").css({"background" : "black"});}
if($(this).hasClass('white'))
{$("#that_event").css({"background" : "white"});}

$("#all_events_big").css({"width" : "0","height": "0"});
$("#all_events_big").children().css({"width" : "0em","height": "0em"});

});

</script>
</body>
</html>
2. Маin
#that_event
{
display:inline-block;
vertical-align:top;
border:0.1em solid black;
height:30em;
width:30%;
}

#all_events_big
{
display:block;
position:absolute;
top:0;
left:0;
width:0;
height:0;
background:red;
transition: all 1s; -webkit-transition: all 1s; -o-transition: all 1s; -moz-transition: all 1s; -ms-transition: all 1s;
}

.red,.black,.white
{
display:inline-block;
width:0em;
height:0em;
}
.red {background:green;}
.black {background:black;}
.white {background:white;}

#all_events
{
transition: all 2s; -webkit-transition: all 2s; -o-transition: all 2s; -moz-transition: all 2s; -ms-transition: all 2s;
border:0.1em solid black;
display:inline-block;
vertical-align:top;
height:10em;
width:30%;
background:red;
}

#cal
{
padding-top:3em;
width:800px;
height:1024px;
border:0.2em solid black;
display:block;
text-align:center;
margin-left:200px;
}
3.Проблема
$("#all_events_big").css({"width" : "90%","height": "90%","top":"5%", "left":"5%"});
Вот этот кусок не работает в ie начиная с 9-. Убираем эту строку - все работает. А вот она нет. Думаю можно не говрить что в остальных браузерах все работает ?:)

Подскажите в чем ошибка? Искать ошибку в ДНК не отправляйте.