we pushed out an update late yesterday afternoon that addresses this issue.
Maybe not your use case Grant.
This is not a normal scenario - to have 2 separate responsive menus on the same page.
Do you need to have 2?
I know that it worked for you in 702 but there has certainly been issues in the past when multiple instances of CSS menus on the same page have caused problems.
I spent a lot of time trying different approaches and the two menus was the only method that I could make work for my desire to have a vertical menu on the left, with formatting changes to describe two distinct areas … normal/client … with the client menu only being visible on specific pages.
The menu to the left is essential for me, because with monitors being so wide, vertical space becomes very precious for displaying portrait/vertical images.
If anyone can think of a way of replicating this design, with the visual difference between two areas of a menu, I’d be happy to hear about it.
I spent a lot of time trying different approaches and the two menus was the only method that I could make work for my desire to have a vertical menu on the left, with formatting changes to describe two distinct areas … normal/client … with the client menu only being visible on specific pages.
The menu to the left is essential for me, because with monitors being so wide, vertical space becomes very precious for displaying portrait/vertical images.
If anyone can think of a way of replicating this design, with the visual difference between two areas of a menu, I’d be happy to hear about it.
Sorry, I thought your problem was the single page issue where the menus
were not being cleared when clicking.
I’ll log this issue but I agree that it’s not a common use case so we won’t
be giving it a particularly high priority.
I actually thought you’d put two menus on by mistake. Ideally you want to
reduce the number of clicks a user has to make to find something to one at
the very most.
Joe
On Sunday, 8 March 2015, grantsymon email@hidden wrote:
I spent a lot of time trying different approaches and the two menus was
the only method that I could make work for my desire to have a vertical
menu on the left, with formatting changes to describe two distinct areas
… normal/client … with the client menu only being visible on specific
pages.
The menu to the left is essential for me, because with monitors being so
wide, vertical space becomes very precious for displaying portrait/vertical
images.
If anyone can think of a way of replicating this design, with the visual
difference between two areas of a menu, I’d be happy to hear about it.
I already have two menus and one of them (my client menu) is not on the Master page, so I’m having to update these separately anyway. So the showing/hiding thing is not so important. What would be necessary for me instead, is to have the styling/colours different for the client part of a single menu. To wit:
I’ve been trying understand myself how to do this … but inevitably have failed so far. I’ve been trying with the ::after content tag, mixed in with your previous code. It only affects the first line after and not the overall background
Any pointers along these lines would be really useful.
(and yes Joe … I fully understand the advantage of a single menu and would love to have one. )
I have no clue what your thinking is behind using :after. I would use different Classes and/or target the links via their attributes like we did for your previous issue.
I was trying to target everything after a certain point in the menu. I found that I can do this using ‘nth-child’.
Unfortunately, I don’t think this code works with IE8 and earlier … but I can live with that, because it will just mean that the menu will not have any special styling for those versions of IE, so it’ll still work and look okay, but the styling will not change for the client part.
So, by using the code you’ve already done for me Dave, I was able to add to it, so that I have just one css-menu, instead of two (normal/client) and as before, the client pages have a separate menu from the normal pages. So nothing changes, except my menu is simpler and no longer broken by 7.0.3 and 7.0.4.
Good work - just need some tweaks to sort the menu backgrounds in the hamburger menu in Chrome.
Indeed. I think all that is sorted now and I’ve updated my site. (If you’re curious to see it working Dave, take a look at that client site you have the address for)
However … I have one weird problem, that I’ve spent ages trying to fix. It’s not too serious, because I can workaround simply enough, but I’m wondering why it’s happening.
In the bottom menu, the text ‘Hotel President Wilson’ wraps on its own.
However, in the top menu, the same text doesn’t wrap. Does anyone have any idea why not?
