Darstellung Webseite im Firefox,Chrome und Internet-Explorer

Meine Webseiten möchte ich für 2015 zu überarbeiten. Ich bin jetzt auf folgendes Problem gestoßen das der definierte Container durch Firefox und
Chrome richtig dargestellt wird. Im Internet-Explorer wird dieser um einige Pixel größer dargestellt. Das hat zur Folge dass der Hintergrund auf der Seite nicht richtig erscheint und die Werbung die außerhalb des Containers liegt verschoben wird.
Siehe zum Beispiel: http://mobile-seiten.fahrrad-workshop-sprockhoevel.de/Schaltung_einstellen_shimano.htm
Das sind die CSS Dateien:
#container1 {
border-style: none;
background-position: 0px 0px;
margin: 0 auto;
position: relative;
height: 2120px;
width: 985px;
clear: left;
border: 1px solid #333333;
background-color: #BEBEBE;
background-repeat: repeat;
background-attachment: scroll;
top: 2px;
left: -2px;}
----------------------------------------
#werbung {
border: 0px solid #333333;
position: absolute;
right: 0px;
left: 1090px;
top: 270px;
width: 98px;
height: 400px;
z-index: 1;
background-repeat: repeat;
}
------------------------------------
Wie kann ich das Problem beheben?

Im Internet-Explorer wird dieser um einige Pixel größer dargestellt. Das hat zur Folge dass der Hintergrund auf der Seite nicht richtig erscheint und die Werbung die außerhalb des Containers liegt verschoben wird.

In meinem Firefox wird die Werbung auf der rechten Seite auch teilweise vom Container verdeckt. Das liegt denke ich nicht am Browser, sondern an der Größe des Browserfensters.

#container_haupt ist mittels margin:auto zentriert, während #werbung absolut positioniert ist. Je nach Fensterbreite verändert sich deswegen die Position von #werbung in Relation zu #container_haupt - verkleiner mal testweise das Browserfenster. Abhilfe könntest du z.B. dadurch schaffen, dass du sowohl Hauptcontainer als auch Werbe-Container in einen übergeordneten, zentrierten Container packst, und die beiden dann mittels float nebeneinander anordnest.