I'm going (at least hoping) to get perfect codes to feed my little firefox and IE. Thanks for the Error Console in Firefox which let me easily spot out what's wrong that the firefox doesn't handle.
And there it comes, it says cannot parse the "display" value. and I've search up and down in my ASP.NET pages, including the MasterPages for the keyword "display", no luck, I didn't write it!
So, the easiest way is ofcourse, do a search on the source code in Firefox (the source that is after render). and I've found the culprit -- my custom server control is emitting style="display:inline-block", which is automatically being rendered by the ASP.NET base control.
It turns out to be that as long as you set the Width (or Height) of the control and you didn't overrides the Render (instead suppose you are using RenderContents), the ASP.NET Web Control base class will render the IE-friendly but non-standard "display:inline-block" in the control's style (wrapped in SPAN tag).
So the obvious and most easy way out is, to override the render function so that it doesn't emit the buggy stylesheet declaration, but the drawback is that you'll need to write some codes to handle the style sheet in that case.