ie float problem

[hydrix]

ok i have tested in chrome firefox opera and safari all of them work. but in ie it just wont display my divs right.
i have 6 divs each with a image and text at the bottom. ie for some reason.
puts the 5th div right under the 4th in stead of going under the first. and the 6th one breaks under the 5th and sits under one. if you wish too
i only tested this in ie9 here is the code.

the css
#disc
{
width: 192px;
height: 55px;
float: left;
display: block;
}

#tcont
{
text-align: center;
float: left;
display: block;
height: 251px;
width: 192px;
margin:0px 50px 25px 0px;
}
#tcontainer
{
display: block;
width: 1000px;
}

#thedesign
{
border:4px solid #e6e6e6;

}

the html
<div id="tcontainer">
    <div id="tcont">
        <div>
            <img style="WIDTH: 192px; HEIGHT: 192px"
                 id="thedesign"
                 title=""
                 border="0"
                 alt="I BUY FOR UNDER AGE KIDS"
                 src="images/ibuyforunderagekidssmall.jpg">
        </div>

        <div id="disc">
            <h2><font color="#E6E6E6"><font face=
            "Arial Black"><span style=
            "FONT-SIZE: 10pt"><a style="TEXT-DECORATION: none"
               href="index.html"
               target="_blank">I BUY FOR UNDERAGE
               KIDS</a></span></font></font></h2>
        </div>
    </div>

    <div id="tcont">
        <div>
            <a href=
            "IM-IN-YOUR-STORE-STEALN-ALL-UR-****-GUYS.php"><img style="WIDTH: 190px; HEIGHT: 190px"
                 id="thedesign"
                 title=""
                 border="0"
                 alt=
                 "IM IN YOUR STORE STEALN ALL UR **** - GUYS"
                 src="images/im-in-your-store-guys.png"></a>
        </div>

        <div id="disc">
            <h2><font color="#E6E6E6"><font face=
            "Arial Black"><span style=
            "FONT-SIZE: 10pt"><a style="TEXT-DECORATION: none"
               href="index.html"
               target="_blank">IM IN YOUR STORE STEALN ALL UR
               **** - GUYS</a></span></font></font></h2>
        </div>
    </div>

    <div id="tcont">
        <div>
            <img style="WIDTH: 190px; HEIGHT: 190px"
                 id="thedesign"
                 title=""
                 border="0"
                 alt=
                 "IM IN YOUR STORE STEALN ALL UR **** - GIRLS"
                 src=
                 "images/im-in-your-store-stealn-all-ur-****girls.png">
            </div>

        <div id="disc">
            <h2><font color="#E6E6E6"><font face=
            "Arial Black"><span style=
            "FONT-SIZE: 10pt"><a style="TEXT-DECORATION: none"
               href="index.html"
               target="_blank">IM IN YOUR STORE STEALN ALL UR
               **** - GIRLS</a></span></font></font></h2>
        </div>
    </div>

    <div id="tcont">
        <div>
            <img style="WIDTH: 192px; HEIGHT: 192px"
                 id="thedesign"
                 title=""
                 border="0"
                 alt="DON'T WORRY IM A PROFESSIONAL POT HEAD"
                 src="images/potheadsmall.png">
        </div>

        <div id="disc">
            <h2><font color="#E6E6E6"><font face=
            "Arial Black"><span style=
            "FONT-SIZE: 10pt"><a style="TEXT-DECORATION: none"
               href="index.html"
               target="_blank">DON'T WORRY IM A PROFESSIONAL
               POT HEAD</a></span></font></font></h2>
        </div>
    </div>

    <div id="tcont">
        <div>
            <img style="WIDTH: 192px; HEIGHT: 192px"
                 id="thedesign"
                 title=""
                 border="0"
                 alt="GIRLS RULE "
                 src="images/girls-rule-small.png">
        </div>

        <div id="disc">
            <h2><font color="#E6E6E6"><font face=
            "Arial Black"><span style=
            "FONT-SIZE: 10pt"><a style="TEXT-DECORATION: none"
               href="index.html"
               target="_blank">GIRLS
               RULE</a></span></font></font></h2>
        </div>
    </div>

    <div id="tcont">
        <div>
            <img style="WIDTH: 192px; HEIGHT: 192px"
                 id="thedesign"
                 title=""
                 border="0"
                 alt="MARRIAGE IT'S A *****"
                 src="images/marriagesmall.png">
        </div>

        <div id="disc">
            <h2><font color="#E6E6E6"><font face=
            "Arial Black"><span style=
            "FONT-SIZE: 10pt"><a style="TEXT-DECORATION: none"
               href="index.html"
               target="_blank">MARRIAGE IT'S A
               *****</a></span></font></font></h2>
        </div>
    </div>

</div>

i have tryed everything i cant figure it out because im a noob at this stuff lol.

[teedoff]

Do you have a link to your live site? If not, post ALL your html and css.

[DanInMa]

well firt things first. you appear to have mutiple elements with the same id, this is bad. you are also using things like font-face and alot of inline styling. the first thing you need to do is make sure your document is valid before trying to attempt any kind of manipulation with JS.

paste you entire web page's source code here and it will tell you where there are issues.

http://validator.w3.org