My website does not work in i.e

Question

Hello i have made a template and a whole role playing game with over 400 pages of coding now users have told me the page does not work in i.e . I have viewed my website in firefox and chrome and works fine. But when i view it in i.e it shows a messed up page. I have tried using

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> 
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" /> 

But does not work / help i also have scroll bars ( when logged in ) And if your shuffle over to the left or right of the page by using left or right keys on the keyboard the slidey bar does not slide down. So is there anyways to make my template work in i.e and stop users from pressing left and right e.g the template from moving left to right ?

Here is my css

html
{
    background: url(../images/background.png);
    background-color: transparent;

}

body {
    width: 1000px;
    margin: auto;
    padding: 0;
    text-align: center;
    color: #000000;
    font-family: verdana;
    font-size: 0.7em;
}

.auction_box
{   
display:inline-block ;
}


div.container
{   
    width:100%;
    height:100%;
    position:absolute;
    margin:auto;
}


div.holder
{
    width:990px;
    background-color:#d7f7f7;
    height:100%;
    margin:auto;
    margin-top:0px;
    background-image:url('../images/swampertbackground.png');
    background-repeat:no-repeat;
    background-position:bottom center;
}
#container{
    height: 100%;
    width: 1000px;
    background-color: #d7f7f7;
    position: fixed;
    border-bottom-left-radius:10px;
    border-bottom-right-radius:10px;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    border-left: solid #25a5a6 2px;
    border-right: solid #25a5a6 2px;
    overflow-y: auto;
    overflow-x: auto;
}
div.banner
{
    height:125px;
    width:700px;
    display:block;
    position:absolute;
    margin-top:2px;
    margin-left:140px;
    background-color:#FFF;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border: solid #25a5a6 1px;
    background-image:url('../images/banner.png');
    box-shadow: 3px 3px 3px #4b8384;
}

ul , li
{
    margin:0px;
    padding:0px;
    list-style:none;

}
div.left_navigation
{
    position:absolute;
    margin-left:5px;
    margin-top:150px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
    width: 152px;
}

div.leftside2_navigation
{
    position:absolute;
    margin-left:5px;
    margin-top:280px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
    width: 152px;
}

div.left_navigation2
{
    position:absolute;
    margin-left:5px;
    margin-top:330px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}

div.clans
{
    position:absolute;
    margin-left:5px;
    margin-top:410px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}

div.left_navigation3
{
    position:absolute;
    margin-left:5px;
    margin-top:525px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}
div.left_navigation4
{
    position:absolute;
    margin-left:5px;
    margin-top:620px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}
div.left_navigation5
{
    position:absolute;
    margin-left:5px;
    margin-top:680px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}

div.left_navigation6
{
    position:absolute;
    margin-left:5px;
    margin-top:750px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}

li.header
{
    width:150px;
    height:14px;
    background-color:#54c0c1;
    border:1px #188c8d solid;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    background-image:url('../images/header.png');
    border-left:2px #188c8d solid;
    color:#FFFFFF;
    font-weight:900;

}
li.links
{
    width:150px;
    height:16px;
    background-color:#c1f9fa;
    border-bottom:1px #188c8d solid;
    border-left:2px #188c8d solid;
    border-right:1px #188c8d solid;
    color:#074647;

}

li.links:hover
{
    background-color:#FFFF00;
    color:#296584;
    font-weight:bold;
    text-shadow: 1px 2px 2px #0096ff;

}
li.footer
{
    width:150px;
    height:9px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
    background-image:url('../images/header.png');
    border-bottom:1px #188c8d solid;
    border-left:2px #188c8d solid;
    border-right:1px #188c8d solid;
}
div.centerboxholder
{   
    position:absolute;
    top:150px;
    margin-left:165px;
    width:661px;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}
div.centerbox
{   
    position:absolute;
    width:661px;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px; 
}
li.chead
{
    width:660px;
    height:14px;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    background-image:url('../images/header.png');
    border-left:2px #188c8d solid;
    border-right:1px #188c8d solid;
    border:1px #188c8d solid;
    color:#FFFFFF;
    font-weight:900;
    box-shadow: 0px 0px 3px #4b8384;
}

li.ccontent
{
    width:659px;
    background-color:#c1f9fa;
    border-bottom:1px #188c8d solid;
    border-left:2px #188c8d solid;
    color:#000;
    font-size:0.9em;
    border-right:1px #188c8d solid;
    box-shadow: 3px 3px 3px #4b8384;
}
li.cfoot
{
    width:659px;
    height:9px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
    background-image:url('../images/header.png');
    border-bottom:1px #188c8d solid;
    border-left:2px #188c8d solid;
    border-right:1px #188c8d solid;
    box-shadow: 3px 3px 3px #4b8384;
}

div.right_navigation
{
    position:absolute;
    margin-left:834px;
    top:150px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}

table
{
    padding:0px;
    margin:0px;
    border: 0px;
    font-size:0.9em;
    font-weight:bold;
    color:#000;
}

td
{
    border:1px #188c8d solid;
    width:200px;
    text-align:center;
}

#textfield
{
    color: #000000;
    font-family: verdana;
    font-size: 1em;
    font-weight: bold;
    background-color:#e2fffc;
    border:1px #188c8d solid;
    border-radius:5px;
}
#gender
{
    color: #000000;
    font-family: verdana;
    font-size: 1em;
    font-weight: bold;
    background-color:#e2fffc;
    border:1px #188c8d solid;
    border-radius:5px;
    width:110px;
    padding:0px;
}
#gendertop
{
    color: #000000;
    font-family: verdana;
    font-size: 1em;
    font-weight: bold;
    background-color:#e2fffc;
    border:1px #188c8d solid;

}
#genderbottom
{
    color: #000000;
    font-family: verdana;
    font-size:1em;
    font-weight: bold;
    background-color:#e2fffc;
    border:1px #188c8d solid;
}

#button
{
    background-color:Transperent;
    color: #000000;
    font-family: verdana;
    font-size: 1em;
    font-weight: bold;
    background-color:#e2fffc;
    border:1px #188c8d solid;
    width:100px;
    padding-top:0px;
    margin:0px;
    height:16px;
    padding-bottom:5px;
}
#Avatar
{
    color: #000000;
    font-family: verdana;
    font-size: 1em;
    font-weight: bold;
    background-color:#e2fffc;
    border:1px #188c8d solid;
    border-radius:5px;
    width:110px;
}
#changer
{
    color: #000000;
    font-family: verdana;
    font-size: 1em;
    font-weight: bold;
    background-color:#e2fffc;
    border-bottom:1px #188c8d solid;


}

li.topper
{   
    height:12px;
    border:1px #188c8d solid;
    border-top-left-radius:5px;
    border-top-right-radius:5px;
    background-image:url('../images/header.png');
}
li.bottomer
{

    border:1px #188c8d solid;
    border-bottom-left-radius:5px;
    border-bottom-right-radius:5px;
    background-image:url('../images/header.png');
    height:12px;
}

#button:hover
{
    cursor:pointer;
}
a:link { color:#296584; text-decoration:none;display:block;}
a:visited { color:#296584; text-decoration:none;}
a:hover { color:#296584; text-decoration:none;text-shadow: 1px 2px 2px #0096ff;}
a:active {color:#296584; text-decoration:none; background-color:}

My website url is pokemontoxic.net so everyone cna view it in i.e and see what i mean. Thanks

Answer 1

1st:

Emulate7 will tell all IE browsers to pretend to act as if they're IE7. Just remove these lines:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />

and instead, add the below code, which means your site supports IE7:

<meta http-equiv="X-UA-Compatible" content="IE=7"/>

2nd:

In your CSS, you have div.container and div.holder, the dot stands for a "class", but you have <div id="container"> and <div id="holder">. So either you change the CSS to div#container and div#holder OR change the attribute id to class, like this <div class="container"> and <div class="holder">

Answer 2

You've got your doctypes wrong. At the top of your pages, change this:

<html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

to this:

<!doctype html>
<html>

Or, at least swap their places.