IE doesn't display properly the same code on the same page twice

Question

Okey, here it goes. I have a block of code that repeats it self twice. But it doesn't display the same, it is on the same page. I've checked everything is the same the html and the CSS. I realy can't wrap my head around this. This code is part of joomla module. I have to note that this is not my code!!! But i have to fix it so..

    <div class="user123content">
 <div class="firstDiv">
            <div class="secondDiv">

                <div class="thirdDiv">
                    <div style="float: left; width: 171px; text-align: center;"> 
                        <div>
                            <span style="font-weight: bold;">Product</span>
                            <br>
                            <br>
                            <a href="#">
                                <img height="150" border="0" width="116" alt="Product des" src="img.jpg"></a>
                                <br>
                        </div>
                        <span class="productPrice">
                                111 $ 
                        </span>
                        <br>
                        <span></span>
                    </div>
                </div>

                <div class="thirdDiv">
                    <div style="float: left; width: 171px; text-align: center;"> 
                        <div>
                            <span style="font-weight: bold;">Product</span>
                            <br>
                            <br>
                            <a href="#">
                                <img height="150" border="0" width="116" alt="Product des" src="img.jpg"></a>
                                <br>
                        </div>
                        <span class="productPrice">
                                111 $ 
                        </span>
                        <br>
                        <span></span>
                    </div>
                </div>

                <div class="thirdDiv">
                    <div style="float: left; width: 171px; text-align: center;"> 
                        <div>
                            <span style="font-weight: bold;">Product</span>
                            <br>
                            <br>
                            <a href="#">
                                <img height="150" border="0" width="116" alt="Product des" src="img.jpg"></a>
                                <br>
                        </div>
                        <span class="productPrice">
                                111 $ 
                        </span>
                        <br>
                        <span></span>
                    </div>
                </div>

            </div>
        </div>
    </div>

and the CSS:

    .thirdDiv {
 float: left;
 width: 176px;
 height: 240px;
    }

the div that contains all that is 550 px wide

Answer 1

Use FireBug to find out why.

Perhaps the second time it is nested within another div and there is a style like:

.otherDiv .thirdDiv {
    width: 300px; /* override width */
}

Answer 2

I copied your code over and tested it local, there was no issue. All three boxes displayed tiled horizontally. I would double check that none of your css rules are interfering with any of the pre-bluilt Joomla rules or the other way around... I tested on 5 different browsers (ie8, chrome, ff, opera, safari), with the same outcome for each.