Superfish is a very common menu plugin, so I'm surprised I'm having difficutly rectifying this.
I have a pretty intense menu structure that involves several child menus. So much so, that a lot of them fall off of the page or out of the browser's view when their parent is hovered.
People have suggested applying a right: 0px;
property in place of the left: 0px;
property in the superfish.css
file, but it looks like the JS script is writing it's own CSS properties to the element as in-line styles. In fact, it actually looks like it's measuring the width of the parent menu in order to apply the correct left:
value.
The sub-menu's end up looking like this
<ul class="sub-menu" style="left: 16.18181818181818em;
float: none; width: 14.5em; display: block; visibility: visible;">
So, I guess what I'm getting at is... what applies these CSS properties if not the CSS file? Even when I apply a specific class for menus I want to 'drop-down' to the right instead of the left, the property gets overridden anyway.
Is there a way to rectify this, or just make it so once I get to the second level of drop downs (when drop downs start going to the left instead of below) they go to the right instead?
I was just dealing with the same issue. It looks like this "feature" fell off the road map :)
Anyways I found this Superfish Menu text off-screen
it solved it for me but YMMV as always.