Shopify themes, liquid, logos, and UX
Hi—
I'm updating my site from Turbo 2.5 to the current (9). Big jump, I know, it was working fine all that time and I didn't need to change it until now.
I've encountered an issue where the top menu shrinks (or perhaps relocates) the fonts whenever there's a caret for a drop-down / mega-menu, and for the life of me I can't find any difference in the code that would explain it. It looks like the whole menu inherits the same font size setting.
I'm wondering if there's a padding issue? I could find that, either.
There's no functional issue here—it works just fine. It's just bugging me...
Gray menu is original (Oswald, all caps). Blue menu is new one with the issue (Raleway, normal caps)
this definitely sounds like a CSS inheritance or layout issue tied to how the caret is rendered in Turbo 9. I’ve seen similar behavior when a dropdown caret is added using ::after or an inline element, which can slightly shift or override font styles on parent links.
Try inspecting a menu item with a dropdown vs one without and compare the computed font-size and line-height. Also, look for any new classes like site-nav has-dropdown that might apply different styles in Turbo 9. A custom CSS override might fix it if the issue is visual-only.
Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025Discover opportunities to improve SEO with new guidance available from Shopify’s growth...
By Jacqui May 1, 2025