CSS - Problems with z-index and overlapping divs - css

I have some problems with my main menu bar. The menu bar has three levels; level one holds the main items, level 2 is the menu that goes down as soon as I put the mouse over a level 1 item and the level 3 menu appears on the right side of the level 2 menu. You can see these things on the following image:
What I want to achieve is that the level three menu is covered by the level two menu, exactly like it is shown on the picture. I want the shadow to be on the level three menu.
Now at the moment it is the other way round, namely the level three menu lies on the level two menu. So the shadow of the level 3 menu is placed on the level 2 menu. You can see this by clicking on the following link: http://beleveneleven.bplaced.net/
I tried this by changing the z-index, creating a new stack layer by using the :before pseudo-css selector, but nothing worked until now.
Any help is very appreciated!
Thanks.

Related

CSS - Horizontal Nested List wrapping out of order

I am trying to fix an issue with my CSS where I am trying to create a three tiered horizontal list.
The intended result is that it looks like a three tiered menu.
When the list gets too long, instead of creating wrapping directly below itself, it wraps below the submenu. This is very obvious once the Horizontal window size becomes smaller (1024 instead of 1920).
https://www.w3schools.com/code/tryit.asp?filename=GI4O70ZXQWZ9
Above is the link to the sample code.
White is the main menu, blue is the submenu and green is another sub-submenu.

Wordpress Genesis framework menu

There is something really strange happening with the menu on the child theme "Education" of the Genesis framework. This framework has two navigation positions: primary and secondary. As you can see here both appear one under the other in the red area. However, there is a third position that seems to be hardcoded in the child theme (?) and won't go away even if I don't assign a position to the menu.
Can you guys give me an idea what is going on? I'm not very good at this stuff. I tried looking into the child theme's code, but found nothing referencing this...
Ultumately what I want to do is use the top position (the one in the white area), but I can't, because I need to make the site multilingual, but that top position doesn't appear in the menu options, so I can't assign different menus for the different languages.
The white area at the top right is a widget area. The site already has two widgets in that Header Right widget area - a text widget (with the phone number), and a nav menu widget (the three locales).
You could make it two nav menu widgets. See Appearance -> Widgets, or use the Customizer. Alternatively, you could adjust the CSS, so that the red / grey locale 'tabs' become different looking links with a white background.
Also useful, if you do just need a single menu location there, would be the Genesis Header Nav plugin.

Show previous visited drop down menu item color different than other menu items.

I have a drop down menu based on CSS. Suppose there are 5 menu items at top level, when we hover on them show a drop down. My requirement is if I hover on menu item# 3 and select something from it then I will hover on menu item# 1 then menu item# 3 color need to be different in comparison to other menu items.
Please let me know how to do the same.
If I understand your question correctly then you want to use the :visited selector in your css. Hard to give specifics without you providing some code, but this is the general idea:
a:visted {
color: orange;
}
You can go Here for an example. That link also contains examples for other related selectors which might be useful to you, such as :hover

Joomla/Virtuemart: Sub-Menu items not showing on vertical menu

I have mod_mainmenu module on the left side of my page. I have a menu that I've created out of various URL's to different categories in Virtuemart. I did not use the Virtuemart catergories module because I didn't want ALL categories to appear, only certain ones.
Does anyone have any suggestions as to what may be happening?
==MORE INFO: 01/24/12==
I want the sub-menus to slide or something when I scrollover or click on them, but they aren't.
Start Level is at 0, End Level is at 10, and Always show sub-menu items is on No. When I change 'Always show sub-menu items' to 'Yes', it will show the sub-menu items, but I don't want them to always show.
Another strange thing: I tried using the RokNavMenu module since I know that it has a slide feature, and that one doesn't do it either.
The 'ARI Ext Menu' module does, but it won't show the names of the sub-menus, just bullet points.
There are 3 settings you need to look at in your module config - Start Level, End Level, and Always show sub-menu Items. Keep in mind that numbering starts at 0, so start level should be 0, End Level should be some number greater than the number of submenu levels you have or plan to have, and Always show sub-menu items should be set to yes.

drupal display submenu when parent has been selected

I've have a menu structure that has a depth of 3 levels on a drupal 6 CMS.
When I click on a level 1 that has children, the level 2 menu items display fine. If the level 2 has children, it is not showing the level 3.
If I check the expanded box the level 3 is displayed however, it displays all the time irrespective of the level 2 that has been selected. It seems to display whenever it's parent level 1 is selected.
For further information, the menu items are a mixture of custom links & content links. i.e. Links I've enetered manually when creating the menu and others generated by when creating a node or view display.
All I want is to show the children if there are any for the selected parent.
Am I missing something fundamental here?
Thanks
Steve
In the menu settings you should play around with a setting called "expanded". See /admin/build/menu-customize/primary-links and play around with the expanded setting.
If you expand a menu item then all its children are displayed in the block, otherwise only when you click on the parent item do the children get displayed.
You can have some more control on menu's in blocks by checking out http://drupal.org/project/menu_block

Resources