Works perfectly in firefox but not IE

programming web dev
1

http://mbergstrom.1free.ws/

This is my latest portfolio design, and I have no idea why it does not work in IE like it does in Firefox, what am I doing wrong? Please ignore the incorrect grammar and what not its mainly just dummy text and will be fixed later.


<html>
<head>
<title>The ramblings of Michael Bergstrom</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="keywords" content="art,web,design,development,winamp,skins,awesome,pancakes,pie">
<meta name="description" content="Micheal Bergstroms ramblings! Beware! I'm more awesome then you!">
<link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>

<div id="version">
Vr. 1.0
</div>

<div id="navigation">
   <ul id="navlist">
                    <li><a href=http://mike-db.deviantart.com/>DeviantArt</a></li>
                    <li><a href=http://www.winamp.com/user/details/623045/submissions/>Winamp</a></li>
                    <li><a href=http://www.axlar.com/>Axlar</a></li>
                    <li><a href=http://www.peacemakergfx.com/>PeaceMaker</a></li>
   </ul>
</div>

<div id="info">
<ul id="infobox">
<h1>Michael Bergstrom...</h1> Is a seventeen year old dude, he enjoy's such things like drawing, user interface customization, painting, graphic design, and sailing. Mike might not be good at what he does, but he enjoy's it. Some times you will catch him taking the odd photgraph, or actually going outside and enjoying this new thing he heard about called "life" he currently goes out and about a lot! But always has time to work on the odd website here and there. Music influences Mike a lot in life, it changes his mood and the way he does things. For example: if he is listening to really fast metal whilst driving, chances are he is going to drive, really, really, FAST! But that is how Mike does things, music also effects how he does his art. He usually tries his best to do better then the last time he did something and is always looking for ways to improve him self!
</ul>
</div>

<div id="art">
<ul id="box">
<img src="wanted.jpg">
</ul>
<ul id="box">
<img src="Window_Remake.jpg">
</ul>
</div>

<div id="copyright">
<ul id="text">
Copyright &copy; Michael Bergstrom 2006 - 2009. All rights reserved.
</ul>
</div>

</body>
</html>



body {
    font-family:Verdana;
    font-size:11px;
    margin:0px;
    padding:0px;
    background-image:url('bg.png');
    background-repeat:no-repeat;
}

h1 {
    font-size:21px;
    color:#9a1212;
    font-weight:bold;
}

#version {
    font-size:10px;
    color:#ebeaea;
}

#navigation {
    margin-top:320px;
    position:absolute;
    width:100px
}
   
ul#navlist {
    list-style-position:outside;
    list-style-type:none;
    margin:0;
    padding:0;
}

ul#navlist li {    
    float:left;
    width:100px;
    margin-top:10px;
    padding:0;
    text-align:left;
}

ul#navlist li a {
    color:#FFF;
    display:block;
    font-size:11px;
    text-decoration:none;
    height:30px;
    font-weight:bold;
    padding:4px 15px 0 8px;
    background-color:#9a1212;
}

ul#navlist li a:hover {
    background-color:#9a1212;
    color:#aeaeae;
}

#info {
    margin-top:10px;
    margin-left:200px;
    width:650px
}

ul#infobox {    
    width:100%;
    padding:0px 10px 10px 10px;
    text-align:left;
    background-color:#ebeaea;
    border:1px solid #aeaeae;
}

#art {
    margin-top:10px;
    margin-left:200px;
    width:650px
}

ul#box {    
    width:100%;
    padding:10px 10px 10px 10px;
    text-align:left;
    background-color:#ebeaea;
    border:1px solid #aeaeae;
}

#copyright {
    margin-top:10px;
    margin-left:200px;
    margin-bottom:10px;
    width:650px
}

ul#text {    
    width:100%;
    padding:10px 10px 10px 10px;
    text-align:left;
    background-color:#ebeaea;
    border:1px solid #aeaeae;
}