hi
anyone could help me to decrease the size of my navigation section with css code:
Topic summary
A user seeks help reducing the height of their navigation section on a Dawn theme Shopify store.
Initial Problem:
- Navigation section appears too large
- User provided store link for review
Solutions Provided:
Code Issue Identified:
- An
<h1>tag is incorrectly placed within the navigation area - Recommendation: Move the
<h1>tag outside navigation (below or inside banner)
CSS Adjustments:
- Modify padding value in the navigation code (currently set to
padding: 2rem) - Increasing padding (e.g., to
2.5rem) increases height; decreasing it reduces height - Alternative solution: Add custom CSS code in
theme.liquidfile under the<head>element
Resolution:
The issue was successfully resolved using the provided guidance.
Hi Mathieulenoir,
What theme are you using? or can you share a link to your site so we can look at the code and tell you.
Regards
Danny
Hi Mathieulenoir,
First: Fix your code, this
should NOT be where the navigation is (screen shot below). I would recommend you remove it and just place it below the banner or in the banner.
Secondly: to increase / decrease the height, in the screen shot you can see where the arrow is, just above it you have padding:2rem, if you increase the padding example 2.5rem it’ll increase the height and vice-versa.
Regards
Danny
Go to your Online store > Themes > Edit code > open theme.liquid file, add this code below under element
1 Like
thank you so much for your help! fixed!
Excellent, try and also move the
issue outside of the navigation as well.
1 Like