Archived topic
How to target sub-menu in CSS
3 replies · Started by anabella on June 1, 2022
On my website's menu I have:
An item called PRODUCTS > in the submenu, I have 2 categories (COLUMNS) > inside each category I have a few items.
I want to add an icon ONLY to the CATEGORIES (not to the items inside those categories). I managed to add the icon through CSS, but it's applying to everything (all the items in the submenu). I can't find a way of targeting only the CATEGORIES (COLUMNS)
Please see the link provided > The only items that should have the icon are COLUMN 1 and COLUMN2. The sub-items (called "test") shouldn't have an icon.
Thank you in advance.
Hi there
try this CSS:
.main-nav .menu > li > ul > li > a::before {
content: "";
width: 25px!important;
height: 25px!important;
float: left!important;
background: url(https://brainstorming.webdesign-project.com/wp-content/uploads/2022/05/frame-28.png)!important;
background-repeat: no-repeat!important;
background-size: contain!important;
}
Amazing! Thank you so much David
You're welcome