Canvas Support

Center "Primary Menu - Style 5" and remove gray line under it

8 replies · opened Apr 6, 2020

DDiaNina2SaApr 6, 2020

Hello

I would like to know :

  1. How to center the menu "Primary Menu - Style 5" like "Primary Menu - Style 2".

  2. How to remove the gray line under the menu.

Thank you.

SSemicolon WebSTAFFApr 7, 2020

Hello,

  1. Simply remove the .full-header Class from the #header Element.

  2. Simply add the .border-bottom-0 Class to the #header Element.

This will definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

DDiaNina2SaApr 7, 2020

Hello,

Thank you for your help,it works fine.

There is still a border on the right of the menu. I tried several things to remove it but I did not succeed. Could you help me ?
I have attached a photo.

Thank you.

SSemicolon WebSTAFFApr 8, 2020

Hello,

Adding the .border-right-0 Class to the #primary-menu's <ul> Tag will fix this.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

DDiaNina2SaApr 8, 2020

Hello,

Your solution did not work but I ended up finding it. Here's how I did it:

#header.full-header #primary-menu > ul {
float: left;
padding-right: 15px;
margin-right: 15px;
border-right: 0px solid #EEE;

Thank you for your help.

SSemicolon WebSTAFFApr 8, 2020

Hello,

Using the following code would have worked in the same way:


&#x9;

Let us know if we can help you with anything else or if you find any further issues.

DDiaNina2SaApr 9, 2020

Hello,

The menu is well centered but the last elements pass on a second line when you go down on the website.
I attach a photo and here is the code:

<!-- Header============================================= -->
<header id="header" class="border-bottom-0">
<div id="header-wrap">
<div class="container clearfix">

		&lt;!-- Primary Navigation============================================= --&gt;
		&lt;nav id="primary-menu" class="style-5"&gt;
			&lt;ul class="border-right-0"&gt;

Thank you.

SSemicolon WebSTAFFApr 11, 2020

Hello,

This occurs when there are too many items in the Menu than the available size. You can consider decreasing the Size of the Text of the Menu Links:


#primary-menu ul li > a {
    padding-left: 12px;
    padding-right: 12px;
    font-size: 12px;
    letter-spacing: 0px;
}

This should definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

DDiaNina2SaApr 11, 2020

Thank you it's perfect.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard