I have an accordian menu on my site. I use jQuery to get the menu's width, subtract that from the window width, then set the width of the content to the difference. This works correctly in every browser I've tried - except Opera, which apparently does not set the content's width.
Here's the relevant HTML:
<table style="width:100%;margin:0;border-spacing:0;border:0"><tr>
<td id="sf_page_contents" style="vertical-align:top;padding:7px">
...
</td>
<td class="tocBackground" id="toc">
...
</td>
</tr></table>
Here's the relevant Javascript:
function initFloatMenu()
{ var content=$("#sf_page_contents");
var toc=$("#toc");
var mX=0; // menu X-position (left)
var wnWidth=$(window).width();
if (content.width()>wnWidth) mX=content.width()+"px";
else
{ mX=wnWidth-toc.outerWidth()+"px";
content.css("width",mX);
}
toc.css("left",mX);
}
I've also tried
else
{ mX=wnWidth-toc.outerWidth();
content.width(mX);
mX+="px";
}
but neither content.css("width",mX)
nor content.width(mX)
cause Opera to set the width of the sf_page_contents
element.
As I've said, this code works correctly in Firefox, IE, Chrome and Safari, but not in Opera.
About Opera
Version information
Version 12.17
Build 1863
Platform Win32
System Windows 7
Browser identification
Opera/9.80 (Windows NT 6.1) Presto/2.12.388 Version/12.17
What do I have to do to get Opera to set the width of the content section correctly?
I'm not looking for "why not do it this way" types of answers, I'm looking for a way to fix the existing code's operation in Opera.
This problem went away when I discovered I had Opera 18 installed and tried using it instead of 12, after I told Opera to do an update and it downloaded version 50 - but the one launched by my winDoze desktop icon is still Opera 12.