CSS, JQuery -Zyklus und IE -Problem

Question

Ich benutze ein Jquery -Plugin namens "Cycle" und habe Probleme mit dem CSS dafür im IE, es sieht in Oper, FF, Chrome und Safari perfekt aus, aber dh die Sads knackt.

www [dot] fotograficpassion [dot] com/home

Sie werden die "neuesten Arbeiten" auf der rechten Seite und die Miniaturansichten unter dem Hauptbild in FF, Safari, Chrome und Opera sehen. Der graue Behälter befindet sich hinter allen Miniaturansichten, aber im IE hält der graue Hintergrund oben auf Von den Miniaturansichten .. Ich habe verschiedene Dinge ausprobiert, damit es funktioniert, ohne Erfolg. Könnte mir jemand bitte helfen?

Hier ist das CSS für die Container, die in IE nicht gut spielen:

/* latest work container */
div#latestHolder {
    position: relative;
    float: left; width: 368px;
    margin: 0px 0px 0px 0px;
    padding: 10px 10px 10px 10px;
    background-color: #666666;
}

/* thumbnails */
div#nav {
    position: relative;
    float: left; left: 0px;
    width: 376px;
    padding: 0px 0px 0px 0px;
    margin: 1px 0px 0px 0px;
}
    div#nav li {
        width: 66px;
        float: left;
        padding: 0px 0px 0px 0px;
        margin: 9px 9px 0px 0px;
        list-style: none;
        cursor: pointer;
    }
    div#nav a {
        padding: 3px;
        display: block;
        background: #404040;
        cursor: pointer;
    }
        div#nav a.activeSlide {
            background: #ffffff;
            cursor: pointer;
        }
        div#nav a:focus {
            outline: none;
            cursor: pointer;
        }
    div#nav img {
        width: 60px;
        border: none;
        display: block;
        cursor: pointer;
    }

Wenn mir jemand helfen könnte, wäre das fantastisch !! :)

Answer 1

Verwenden Sie einfach Überlauf: Versteckt auf Ihren Containern. Standardmäßig wachsen Überlauf: Auto nicht Elemente, um seinen Inhalt zu enthalten. Überlauf einstellen: versteckt (oder Überlauf: automatisch ... Bit damit, dass Sie unerwünschte Scrollbars riskieren) Sie zwingen Ihre Container -Divs, auf die Hight aller ihrer Kinderelemente zu expandieren ... gehörte Elemente.

Answer 2

Die div #latestHolder wird nach links schwebt, was es dazu bringt, es zu aus dem Fluss der Seite entfernt werden. Versuchen Sie entweder eine relative/absolute Position statt von float:left; oder löschen Sie den Schwimmer, bevor Sie das beenden #mainContainer div.

Das Löschen würde das Einwerfen eines Elements auf Blockebene am Ende des #maincontainer div wie so:

<div style="clear: both;"></div>