- This topic has 14 replies, 3 voices, and was last updated 5 years, 4 months ago by
.
-
Posts
-
Hi,
Need CSS Code for creating Drop Down Menus like this –
Refer drop down…
Regds:
Lead Developer
Hi there,
What exactly are you wanting to copy? The arrow?
Typically we only help with theme-related CSS in here, but let me know and I’ll see if it’s a quick thing to help with.
Thanks!
Its drop down sub menus style…
When u open that site, click on any menu then submenus list will be open.. so that style i want to copy..pls tom help.
Customer Support
Something like this should help you to get started:
@media (min-width: 769px) { .main-navigation ul.sub-menu { margin-top: 16px; } .main-navigation ul.sub-menu:after, .main-navigation ul.sub-menu:before { bottom: 100%; left: 0; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; } .main-navigation ul.sub-menu:before { border-bottom-color: #f2f2f2; border-width: 16px; margin-left: 20px; } }no its not looking good and same it should be in all GP theme, Refer case study dropdown Section in my secondary header link below –
however i have requested bit different code like below –
(Refer their header and submenu dropdown style)
Do the needful please…
If you are using the secondary navigation then you need to replace
.main-navigationwith.secondary-navigationin my CSS above.This should be the result:
https://leohsiang.com/debate/As Tom mentioned above, this is as far as we can help with in the support forum here.
If you need further custom coding help, please look into hiring a developer.
I am Sorry Leo, But I am new and learning from you peoples, So please co-operate.
Thanks:
Hi,
I changed .main-navigation with .secondary-navigation in your given CSS above, but you cant click on any sub-menu after the drop-down opens, It’s sudden disappear –
Also when sub menus opens that small tone above is a different colour (Its gray, however menus Background is black) so does not look good, how to make it black so that entire sub menu drop should look like same.
Pls support.
here you can check if you wish (Refer secondary nav) –
I think my solution would only work with one of the click options for the submenu, can you give that a shot?
https://docs.generatepress.com/article/navigation-dropdown/Yes tried and working also but here in India peoples are not so smart, so need hover option only?
Because click option works only if u click over down arrow, or if clicking on menu then menu itself refresh, submenus open only after clicking on the small down arrow icon and you need to click again on the small arrow to close this menu, hence only hover option seems fine.
Also, the small pointer of submenu color is still gray, it’s not black completely ??
help if you can…
Because click option works only if u click over down arrow, or if clicking on menu then menu itself refresh, submenus open only after clicking on the small down arrow icon and you need to click again on the small arrow to close this menu
Try this for the parent menu item:
https://docs.generatepress.com/article/using-the-wordpress-menu-builder/#custom-linkThen you can use the Click – Menu Item option to activate the submenu.
I have already tried this, using this only I have created sub menus and set a custom class, it did not solve the issue..
If you having a problem creating the requested design CSS, So if you have created CSS for any stylish drop-down submenus then you can share that CSS, if I like I will use the same.
I have already tried this, using this only I have created sub menus and set a custom class, it did not solve the issue..
Not sure if I understand this.
The example in my site (https://leohsiang.com/debate/) is using a custom link as a parent menu item and click – menu item as an option.
That’s the only design I have working, unfortunately.
You can try hiring a developer using a service like https://codeable.io/ to achieve whatever you are looking for.
No its does not help, leave it then…
- The topic ‘Need CSS Code’ is closed to new replies.
