I don’t like how a border appears around the menu items to form little boxes. I changed the border to no colour, but then Icons [and possibly other elements] disappeared.

Is it possible to remove the border in the main menu without effecting other elements?

November 4, 2014 at 7:56 pm

Hi brendanogrady!

Please add following code to Quick CSS in Enfold theme options under General Styling tab

.av-main-nav > li > a {
border: none!important;
}

Cheers! Yigit

November 4, 2014 at 9:39 pm

Thanks Yigit. That almost solved everything, but there is still a border in between the logo and menu [I assume logo border]. Can you send a Quick CSS fix for that too?

November 4, 2014 at 9:59 pm

Hey!

Please add following code to Quick CSS as well

# header_main_alternate {
border-top: none!important;
}

Cheers! Yigit

August 12, 2018 at 5:23 am

Hello :-] I am trying to do the same thing—remove the borders around the header and between the menu and social media buttons., but the code is not working for me. Will you have a look?

Thx! Robin

August 12, 2018 at 12:31 pm

Hi,

I changed following code

.av-main-nav > li > a {
border: none!important;
}

to following one and cleared cache

# top .av_header_with_border.avia-menu.av_menu_icon_beside, 
# top .av_header_with_border 
# header_main, .av-main-nav > li > a {
border: none!important;
}

Please review your website :]

Best regards, Yigit

January 21, 2019 at 2:39 pm

I have the same problem with a box around the contact item in the top menu, and have tried allt he suggestions above to no avail. Could you help?

January 21, 2019 at 3:10 pm

Hi hannelynne,

I think you’re using a Button Styled menu. Go to Appearance > Menus > select your Main Menu > then expand Kontakt [click on the triangle on the upper right of the menu item]. Under Menu Style select Default Style then save. Hope this helps.

Best regards, Nikko

January 21, 2019 at 3:34 pm

Thank you so much! That was it. Best regards, Hanne

January 21, 2019 at 5:04 pm

Hi hannelynne,

Glad that we are able to help you :] Thanks for using Enfold and have a great day!

Best regards, Nikko

January 17, 2020 at 11:45 am

hi there, i posted yesterday a message for support but no answer, i suddenly have a thnin line appeared in few of my pages [npt all] at the main menu border [header] , strangely, it happened after the update,

my pages which are not concerned are oddly marketd as “no transparent header” but they do are … and no border line

all my pages with “transparent header” option are indeed transparent but with this border line, [i have to say that the update also changed few things in the set up including social medias icons which appeared.

i tried to write the CSS proposed by yigit but the border line is still there

any other suggestion guys ?

January 17, 2020 at 11:47 am

please dont take in account my message , the last code of Yigit is working perfectly, thank you yigit

Im trying to remove the border box that appears when you toggle the hamburger menu , and when you close it.

There appears to be a border box on only the left and right side of the hamburger menu when toggled or closed.

How can I remove it so there’s no border box when toggled?

Thank you!

[UPDATE]

I was able to find a code that worked to remove the two border lines on the mobile hamburger menu, here’s the code:

.oceanwp-mobile-menu-icon a:focus { outline: none !important; }

mobile-dropdown ul li a:focus {

outline: none !important; }

But I would also like to remove the border on the regular desktop version as well, how can this be achieved?

Thanks for taking a look. I'm sorry but at present the site is only in development so password protected. Here is a snippet of the code [view source] for the top of the page, does this help: