Dropdown Problem with Firefox

Basically, what Firefox did was keep the right div floating to the right, but underneath the middle div. This wasn’t what I wanted at all, and after about half an hour of fiddling with the code I managed to fix it.

The Solution

All I did was cut the right div out of the code and placed it before the middle div. It still had the same style attributes, all that was needed was a quick swap. And hey presto! It worked!

The CSS

#left {float: left;}
#middle {float: left;}
#right {float: right;}

The HTML

Change this:

<div id="left">Left Content</div>
<div id="middle">Middle Content</div>
<div id="right">Right Content</div>

To this:

<div id="left">Left Content</div>
<div id="right">Right Content</div>
<div id="middle">Middle Content</div>