IE verschiebt Container bei längerem Content

[Teroa]

Huhu,

ich stehe vor einem kleinen Problem.
Ich habe ein nettes Design für meine Webseite.
Im Firefox und Opera wird alles super angezeigt.

Beim Internet Explorer aber verschiebt sich der Contentbereich aber bei längeren Inhalten um 31px nach rechts.
Wenn ich bei etwas Inhalt entferne springt die Seite wieder schön auf seinen Platz.
Dabei ist der Contentbereich recht einfach definiert.

<style type="text/css">
#content {
    padding:0px 0px 0px 0px;
    margin-left:256px; 
}
</style>

Ich habe links einen Kasten der sich von oben bis unten durchzieht.
Dann wird 10px Platz gelassen und der Contentbereich wird angezeigt.
Hänge dazu noch ein Bild an.
Hier ein kleiner Auszug des Bereichs. Das CSS kommt drunter.

  <section id="content">
        <div class="container_18 extra-wrap">
            <article class="grid_18 box-shadow1">
                <div class="box">
                    <div class="padding">
                        <h3>Heading</h3>
                        <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
                    </div>
                </div>
            </article>
        </div>
        <div class="clearfix"></div>
    </section>

<style type="text/css">
/*Grid*/
.container_18 {
    margin:0 5px;
    width: 720px;
    font-size:0.8125em;
    line-height:1.4615em;
}

.grid_18 {
    display:inline;
    float: left;
    position: relative;
    margin-left: 5px;
    margin-right: 5px;
}

.extra-wrap {
    overflow:hidden;
}

.box-shadow1 {
    padding-bottom:12px;
    background:url(../images/box-shadow1.png) 50% 100% no-repeat;
}

/*Clearfix*/
/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */

.clearfix:after {
    clear: both;
    content: ' ';
    display: block;
    font-size: 0;
    line-height: 0;
    visibility: hidden;
    width: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

* html .clearfix {
    height: 1%;
}

.clearfix {
    display: block;
}
</style>

Ich komme einfach nicht weiter. Finde einfach nicht heraus was diesen Fehler hervorruft :(
Vielleicht hat mir einer von euch einen Tip?

Liebe Grüße

 

[Teroa]

Konnte das Problem finden.
Eine Box links vom Content hatte das Problem hervorgerufen.
habe da ein paar Änderungen gemacht und Tadaa :)

 

[T4k3C4r3]

Dann viel Glück weiterhin ;)