Hello, again!
Sorry to bother you, but do you know how to make it so that the text is aligned to the left? At the moment we feel that the two columns of text are spread too far apart from one another and would like to get them closer together.
Topic summary
Issue: In the Fashionopolism Shopify theme, the dropdown megamenu became overly transparent again after menu updates; the prior CSS fix no longer worked.
Context: The change broke earlier selectors, so the added CSS no longer applied. Screenshots were shared to illustrate the problem. Code snippets are central to the solution.
Fixes implemented:
- Opaque background: Adding
.megamenu { background-color: #000 !important; }restored a solid background. An alternative CSS approach with updated selectors also worked per the author.
Follow‑up request: Columns in the megamenu appeared too far apart; the author wanted text aligned left/columns closer together.
Resolution for spacing/alignment:
- Added CSS:
.megamenu .grid__wrapper.grid__wrapper-nest { grid-column: 4 / span 6 !important; }to tighten the layout. - Final working snippet also set a white background and bottom border:
#nav .navigation__menuitem.navigation__menuitem--dropdown .megamenu { background: #fff !important; border-bottom: 1px solid #000; }.megamenu .grid__wrapper.grid__wrapper-nest { grid-column: 4 / span 6 !important; background-color: #fff !important; }
Outcome: Author confirmed both transparency and spacing fixes worked after placing CSS in theme.liquid. Thread resolved; request to mark solution. Images/screenshots supported the changes.
1 Like