Hi @sim25ecom , please share your store URL so that I can write the CSS code for you.
Topic summary
Goal: Add a visible “SALE” label above a specific navigation item in the Shopify Dawn theme, including proper placement in the mobile menu.
Context: Store is in development mode (Dawn theme). Access was shared so code could be tailored.
Solution provided: A CSS-only approach using a pseudo-element.
- Set li elements to position: relative.
- Target a specific item with ul.list-menu li:nth-child(2):before.
- Insert content: “Sale”; style with background (#f49961), white text, padding; position absolute at top-right.
Outcome: The desktop/menu implementation works as intended; the user confirmed success. The responder noted the code can be adjusted for both mobile and desktop.
Latest update: The user requested help to reposition the label in the mobile menu specifically to sit above the “Shop” navigation item, showing a reference screenshot.
Notes:
- nth-child(2) selects the second menu item; may need adjustment if the target item’s position differs on mobile.
- Images are important to understand the desired mobile placement.
Status: Partially solved; mobile-specific positioning guidance is still requested (open).