Why is Firefox displaying my page differently?

So the problem is: I have three column layout page. On the right side there is a commercial that I want to be able to turn off on a certain pages so the content expans and the page has two columns instead of three.

I found a solution using display: table-cell. That works in the biggest browsers but a strange problem occurs only in firefox. When I go to my page the commercial drops down below the content and the content expands. Then when I hit refresh the commercial pops up and开发者_如何学JAVA everything seems fine.

Can you please help?

Here is the css:

#wrapper{width: 960px; margin: 0 auto;}

#left{float: left; width: 220px; margin: 6px 0 0 5px;}

#content_wrapper{float: left; width: 724px; margin: 6px 0 0 5px;}
    #content{min-height: 400px; min-width: 522px; max-width: 724px; border: solid 1px #ccc; padding: 12px; vertical-align:top; display: table-cell; }
    #right{width: 168px; padding: 0 6px 0 5px; display: table-cell;}

Internet Explorer does not support table-cell attibute, so if you use Internet explorer and, trying to check at Firefox, they will be difference. Probably firefox is actually working and but IE is not.

No versions of Internet Explorer (including IE8) support the property values "inherit", "inline-table", "run-in", "table", "table-caption", "table-cell", "table-column", "table-column-group", "table-row", or "table-row-group".