Menu item text wrapping onto new line

[Simon LeeParticipant Post count: 16]

Hi,

I am getting some strange behaviour with the dropdown menu. In certain browsers (like Chrome) it seems to wrap portions of the second and third-level menu text onto a second line – but not all the time. If I refresh the browser view, it will often re-set to the correct view with no text wrap.

On IE9 it doesn’t seem to do this at all, and on Firefox it does this only occasionally.

Here are examples of the same screen view in Firefox and Chrome:

http://www.sabisa.org/menu_firefox.jpg
http://www.sabisa.org/menu_chrome.jpg

[themeweaverKeymaster Post count: 730]

Hi Simon,

The theme uses the superfish js menu with supersubs. (http://users.tpg.com.au/j_birch/plugins/superfish/)

What supersubs does is try to size the dropdowns to fit largest items within parameters of min and max widths (given in em units). There will always be slight variations in this due to browser rounding differences and font sizes (since it uses em units). The theme is also responsive so this will also change for different browser window sizes. But the menus are designed to wrap when they exceed the max width (currently 27em).

To adjust the parameters for this you could edit /js/tricks.js. The parameters are clearly identified at the top of this file. In this case you could try experimenting with the extrawidth value or just increase the maxwidth to accommodate your menu items.

[Simon LeeParticipant Post count: 16]

Thanks! Increasing the extra width to 2 seems to have solved the problem.

[themeweaverKeymaster Post count: 730]

At least until you add another long menu item! 🙂

[Author]

Posts