If you have a screen shot, that would be great. You can attach it to a reply, using the "Browse" button below the text box.

The <div id="bodyArea"> needs style="width:100%". I'm not sure why, but it is shrinking to fit the floated content.

The <div id="contentsArea"> is floated to the right and has style="width:100%" but Firefox computes width relative to the parent element, <div id="bodyArea">, and that apparently is indeterminate and needs to be set explicitly.

Actually, it is shrinking to float up next to the blank area of the navigation bar. See cor-el's reply: https://support.mozilla.org/en-US/questions/978904#answer-506108

Another solution, which does not require a width rule for bodyArea, is to remove the overflow:hidden rule from bodyArea.

To ensure that bodyArea fully "contains" contentsArea, which resolves a strange issue with some horizontal lines, you can use one of the classic float containment tricks, such as placing a clearing div as the last element on bodyArea:

<div style="clear:both"></div>

Edit: best solution is: https://support.mozilla.org/en-US/questions/978904#answer-506108

Screen shots related to that last reply:

• with overflow:hidden rule as served
• turning off that rule so the default overflow:visible is applied
• adding a clearing div at the end of bodyArea (using DOM Inspector extension)

Adding #bodyArea {clear:both} works for me.

Hi cor-el, yes, you're right, that is the simplest solution.

I hadn't noticed the coincidence of the width of the content and the remaining blank area on the navigation bar.

Maybe some users have additional content on the bar, e.g., menus only available to logged in users, so when it was tested, the problem wasn't noticed because the bar was fully occupied??

Thank you jscher2000 and cor-el so much!

Explicitly setting bodyArea width to 100% solved this problem some users experienced using our site. I didn't have an opportunity to try #bodyArea {clear:both} because I can't replicate this issue on my computer.