[murageinc]

It’s always hard to be sure to what extent any configuration changes have when it comes to websites and the internet because of all the layers of caching, optimizing, etc. but scrolling, along with some other issues I’ve been having (such as my portfolio gallery not showing or only appearing sometimes) seems to have been resolved after turning off RocketLauncher in my CloudFlare configuration.

Some other notes, in the chance it might help:
1. All minification in CloudFlare is disabled (JavaScript, CSS, HTML)
2. I use the BWP Minify WordPress plugin but have had to make adjustments to get it to play nicely with Dante. See below.

BWP Minify Settings for Dante:
1. contact-form-7 – (JS) Stay at original position – Fixes issue with portfolio UI
2. sf-responsive – (CSS) Do not minify – Fixes iPad layout issue
3. sf-main – (CSS) Do not minify – (Too long ago, I don’t remember, but added same time as sf-responsive)

[murageinc]

If this has been solved, please share the solution as I am having the same issue. It works great in Safari, OK in Chrome… but completely unusable in Firefox.

[murageinc]

Thanks Kyle,

What I needed was that selector. The behaviour I wanted was

nav#main-navigation .menu ul.sub-menu ul.sub-menu {
	min-width: 100px; /* already set by theme */
	right: auto; /* grow as needed to accommodate > 100px strings */
	max-width: 230px; /* don't let it go too far */
}

Thanks guys. I appreciate all the help. You guys rock!

[murageinc]

Please read posts 149118 and 149226.

[murageinc]

Hi Kyle,

Yes, that’s with the CSS from laranz. It affects both menus. I’ll remove that so you can see the default behaviour.

Thanks.

[murageinc]

I’m not sure how else to explain this without drawings 🙂 … When you hover over “Products” a menu drops down. Let’s call that menu #1. The behaviour of that menu is exactly what I want (as explained in post #149192). Now if you hover over one of the items in menu #1, another menu opens up but the behaviour of the width is not the same as menu #1. I would like how the width is calculated to be the same as in menu #1 which has a minimum width and maximum width and can therefore have a width anywhere in between the minimum and maximum, which depends on the text length.

[murageinc]

Are you asking me to add the CSS that you gave me so you can see how it turned out? If so, I’ve just added it. Thanks.

[murageinc]

Thanks Laranz. That does help… but it also affects its parent menu (the Products drop-down). The effect I want is exactly how the parent menu is already set up. See the attached images…

narrow> the min-width of 100px is in effect here
wide> the second menu item is wider than 100px so the menu width expands
max> the third menu item is wider than the maximum so the menu width is at max-width

Is it possible to get this same exact behaviour? If not, is it possible to set the min-width and max-width without affecting the parent menu?

Thanks!

Attachments:

You must be logged in to view attached files.

[murageinc]

Well, this post saved me a lot of time! In order to use the Better WordPress Minify plugin with Dante, you’ll need to go into the plugin’s Manage Enqueued Files settings and turn off minification for sf-responsive and sf-main.

I think it has something to do with the way the plugin handles @media.

[murageinc]

I want it to work like the 2nd level menu works. Correct, I don’t want the “…” to show because there is room for a wider menu so why make it 100px? Why does the 2nd level menu behave differently from the 3rd level menu?

Let’s say the menu has 3 items:
> This is the first item
> This is the second item and the longest
> This is the third item

Ideally…
The menu’s width should be wide enough for the 2nd item, if there is enough space,
OR
the menu’s width should be wide enough for the 2nd item, up to some maximum width.

I hope this clarifies.

[murageinc]

This reply has been marked as private.

[murageinc]

Never mind. I had Template Debug Mode on. Pages look normal now.

[murageinc]

So, in order to populate Alt-1 through Alt-10 with the colours and images set up for the demo, I selected Theme Options > Import/Export, selected Import from file and then pasted the contents of dante_theme-options.txt from the Demo Content folder into the text box.

Be warned, however, that this import will wipe out all your current Theme settings so if you have already begun customizing, you probably want to do this on a separate test site.

For anyone who needs the values for Alt-10, they are:

Alt-10 Background Color: #1dc6df
Alt-10 Foreground Color: #ffffff
Alt-10 Background Image: none
Alt-10 Background Size: auto

[murageinc]

That worked. Thanks so much, Ed.

[murageinc]

This reply has been marked as private.