Removing border on navigation menu on Crave theme

[MoonRoosterLLC]

Hello, 

I want to remove the bottom border (white line) on the nav menu that separates it from the hero banner. Can you please help?

 

[websensepro · Accepted solution]

Hello MoonRoosterLLC,

To remove the bottom border on the navigation menu you'll typically need to modify the theme's CSS,

Here's a general guide on how to do this:

1. Access Theme Customization

• Log in to your Shopify admin panel.
• Navigate to Online Store > Themes.
• Find the Crave theme and click on the "Actions" dropdown menu.
• Select "Edit code."

2. Locate the CSS File

In the left-hand sidebar, under the "Assets" folder, locate and click on the Base.CSS File.  

3. Find the Navigation Menu Styles

• Use your browser's search function (usually Ctrl + F or Cmd + F) to search for the CSS class or ID associated with the navigation menu.
• Look for properties related to borders, such as border-bottom or border.

4. Remove the Border

• Once you've located the relevant CSS code, you can remove the border by deleting or commenting out the lines of code that set the border.
• For example, if you find a line like border-bottom: 1px solid #fff;, you can delete this line or comment it out by adding /* before the line and */ after the line.

Save Changes

Here's an example of what the CSS might look like:

/* Navigation menu styles */
.nav-menu {
  border-bottom: 1px solid #fff; /* Remove or comment out this line */
}

[deepaksharma]

hey @MoonRoosterLLC 

I really want to help but I will be needing your store url along with password if any

[MoonRoosterLLC]

https://tr-healthy-bites.myshopify.com/
Password: MoonRooster711!

[Made4uo-Ribe]

Hi @MoonRoosterLLC 

Would you mind to share your store URL?Thanks!

[MoonRoosterLLC · Accepted solution]

https://tr-healthy-bites.myshopify.com/
Password: MoonRooster711!

[Dan-From-Ryviu]

Hi @MoonRoosterLLC 

You can remove that line from your Online Store > Themes > Customize > Header, uncheck Show separator line option

[websensepro · Accepted solution]

Hello MoonRoosterLLC,

To remove the bottom border on the navigation menu you'll typically need to modify the theme's CSS,

Here's a general guide on how to do this:

1. Access Theme Customization

• Log in to your Shopify admin panel.
• Navigate to Online Store > Themes.
• Find the Crave theme and click on the "Actions" dropdown menu.
• Select "Edit code."

2. Locate the CSS File

In the left-hand sidebar, under the "Assets" folder, locate and click on the Base.CSS File.  

3. Find the Navigation Menu Styles

• Use your browser's search function (usually Ctrl + F or Cmd + F) to search for the CSS class or ID associated with the navigation menu.
• Look for properties related to borders, such as border-bottom or border.

4. Remove the Border

• Once you've located the relevant CSS code, you can remove the border by deleting or commenting out the lines of code that set the border.
• For example, if you find a line like border-bottom: 1px solid #fff;, you can delete this line or comment it out by adding /* before the line and */ after the line.

Save Changes

Here's an example of what the CSS might look like:

/* Navigation menu styles */
.nav-menu {
  border-bottom: 1px solid #fff; /* Remove or comment out this line */
}