IE nested div problem: inner DIV shrinking with the browser window

[cntiz2]

very simple example and very big problem. i have wrapper div which i need to be with a width of 100% and two inner divs (blue and gray). blue div has fixed width and is rather long. it may be a big image or just long url link. now start shrinking browser window. when window becomes smaller than the wide content, wrapper container stops resizing because of the blue div (for FF it is done through 'display: table' property, as i need it to act like a table). the problem now is how the second div behaves. it should stay 100% of parent div, and it works correctly in FF, but in IE it continues to shrink with the browser window. i don't need this effect. is there any workaround for this situation? thanks so much.

[2]
<div style="border: 1px solid red; display: table; width: 100%;">
 <div style="background-color: blue; width: 500px;">some fixed width content</div>
 <div style="background-color: gray;">should be 100% width of parent div</div>
</div>
[/2]

[sandblocks]

Try-
overflow: hidden;

<div style="border: 1px solid red; display: table; overflow: hidden; width: 100%;">
<div style="background-color: blue; width: 500px; overflow: hidden; ">some fixed width content</div>
<div style="background-color: gray; overflow: hidden;">should be 100% width of parent div</div>
</div>