How to add padding space between navigation bar and content on Refresh theme?

Store Design

Topic summary

A user seeks to add padding space between the navigation bar and content on product pages using the Refresh theme.

Proposed Solution:
A PageFly representative suggests a CSS customization approach:

  1. Navigate to: Online Store → Theme → Edit code
  2. Locate the base CSS file (Assets → base.css)
  3. Add the following CSS code at the bottom of the file:
header {
  margin-bottom: 50px;
}

This adds a 50-pixel margin below the header element, creating the desired spacing. The solution provides a straightforward CSS-based fix without requiring theme file modifications beyond adding custom styling.

Summarized with AI on November 23. AI used: claude-sonnet-4-5-20250929.
1

I’m trying to add a padding space between the navigation bar and content on the product page! Thanks in advance. I’m using Refresh theme

2

Hi @culipa

This is Kate from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/base.css->paste below code at the bottom of the file:

.header {
margin-bottom: 50px;
}

Hope my answer will help you

1 Like