Basically, I need firefox to render the stuff below the same way
IE renders it. Here's the code:

<div style="width:750px;background:#EEE">
<div style="width:200px;height:200px;float:left;background:#F00;">a</div>
<div style="width:200px;height:200px;float:left;background:#0F0;clear:left">b</div>
<div style="width:200px;height:400px;float:left;background:#00F;">c</div>
<div style="clear:both"><div>
</div>

IE renders c at the same level as a, instead of b. This is probably
due to another bug of IE, maybe IE is not following W3C's rules again.
But it does the work!
Please also note that the code for a, b and c are going to be generated
dynamically by my application. This may be the real problem!

This part in your b div is the problem:

clear:left

I'm not sure why IE is ignoring it: it usually doesn't. Take that out and see what happens.

IE is leading you down the wrong route not FF

to make them both render the same use;

<div style="width:750px;background:#EEE">
<div style="float:left;">
<div style="width:200px;height:200px;background:#F00;">a</div>
<div style="width:200px;height:200px;background:#0F0;">b</div>
</div>
<div style="width:200px;height:400px;float:left;background:#00F;">c</div>
<div style="clear:both">
</div>

Trying coding your site for Firefox using the W3C Recommendations then use some IE work arounds to make the page display in IE. I had this problem on one of my old sites and using position:relative helps and using percentages also helps a lot.
There are loads of sites telling you about IE workarounds in CSS. Hopefully IE7 will be a little more compliant with standards. Whats the point in having a browser that ignores the standards???

Thanks all the same for the help. Here's the solution given by some guy from the Scillicon Valley.

<div style="width:750px;background:#EEE">
  <div style="width:200px;height:200px;float:left;background:#F00;">a</div>
  <div style="width:200px;height:200px;float:left;background:#0F0;margin:200px 0 0 -200px;">b</div>
  <div style="width:200px;height:400px;float:left;background:#00F;">c</div>
  <div style="clear:both"></div>
</div>

I don't know how that's supposed to work, when the top margin for b differs from that of the top margin of a.

I thought you were trying to get A, B, and C to render at the same level across.

Your code and what you're trying to accomplish are both confusing.