# Centered main navigation bar for Activello WordPress theme

**URL:** <https://colorlibsupport.com/t/centered-main-navigation-bar-for-activello-wordpress-theme/8540>\
**Category:** Activello\
**Created:** [January 3, 2016, 10:08am UTC](https://colorlibsupport.com/t/centered-main-navigation-bar-for-activello-wordpress-theme/8540 "2016-01-03T10:08:39Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![michaelmoras](https://colorlibsupport.com/letter_avatar_proxy/v4/letter/m/49beb7/32.png) [@michaelmoras](https://colorlibsupport.com/u/michaelmoras)\
**Post date:** [January 3, 2016, 10:08am UTC](https://colorlibsupport.com/t/centered-main-navigation-bar-for-activello-wordpress-theme/8540/1 "2016-01-03T10:08:39Z")

</div>

Hi,

Is it possible to center the mail navigation bar?

Thanks,  
Michael

PS: LOVELY template!

---

<div class="post-metadata">

**Author:** ![poppyanthology](https://colorlibsupport.com/user_avatar/colorlibsupport.com/poppyanthology/32/696_2.png) [@poppyanthology](https://colorlibsupport.com/u/poppyanthology)\
**Post date:** [January 11, 2016, 7:57am UTC](https://colorlibsupport.com/t/centered-main-navigation-bar-for-activello-wordpress-theme/8540/2 "2016-01-11T07:57:52Z")

</div>

I’d love to know how to do this. And also remove the search function from the top main navigation bar as well.

Thank you.

---

<div class="post-metadata">

**Author:** ![movin](https://colorlibsupport.com/user_avatar/colorlibsupport.com/movin/32/10922_2.png) [@movin](https://colorlibsupport.com/u/movin)\
**Post date:** [January 11, 2016, 8:16am UTC](https://colorlibsupport.com/t/centered-main-navigation-bar-for-activello-wordpress-theme/8540/3 "2016-01-11T08:16:20Z")

</div>

Hi there,

I hope you are well today and thank you for your questions.

You can center align the main navigation menu by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -\> Appearance -\> Customize -\> Activello Options -\> Other -\> Custom CSS

```auto
.navbar-default .navbar-collapse {
    float: none;
    margin: 0 auto;
    display: table !important;
}

```

To remove search form from the header also use the following CSS code.

```auto
.navbar-default .nav-search {
    display: none;
}

```

Best Regards,  
Movin

---

<div class="post-metadata">

**Author:** ![gallerieq](https://colorlibsupport.com/user_avatar/colorlibsupport.com/gallerieq/32/3232_2.png) [@gallerieq](https://colorlibsupport.com/u/gallerieq)\
**Post date:** [February 1, 2016, 2:41am UTC](https://colorlibsupport.com/t/centered-main-navigation-bar-for-activello-wordpress-theme/8540/4 "2016-02-01T02:41:11Z")

</div>

Hi Movin,

When I use this code:

```auto
.navbar-default .navbar-collapse {
    float: none;
    margin: 0 auto;
    display: table !important;
}

```

The navbar continually stays open in mobile view, covering the rest of the header/some content. Is there a way to have the navbar collapsed? Removing .navbar-collapse and just leaving .navbar results in the navigation going back to left alignment.

Any ideas?

---

<div class="post-metadata">

**Author:** ![movin](https://colorlibsupport.com/user_avatar/colorlibsupport.com/movin/32/10922_2.png) [@movin](https://colorlibsupport.com/u/movin)\
**Post date:** [February 1, 2016, 5:31am UTC](https://colorlibsupport.com/t/centered-main-navigation-bar-for-activello-wordpress-theme/8540/5 "2016-02-01T05:31:07Z")

</div>

Hi @gallerieq,

You can try resolving this issue by using the following CSS code instead of above shared code.

```auto
@media (min-width: 767px){

.navbar-default .navbar-collapse {
    float: none;
    margin: 0 auto;
    display: table !important;
}
}

```

Best Regards,  
Movin

---

<div class="post-metadata">

**Author:** ![gallerieq](https://colorlibsupport.com/user_avatar/colorlibsupport.com/gallerieq/32/3232_2.png) [@gallerieq](https://colorlibsupport.com/u/gallerieq)\
**Post date:** [February 1, 2016, 2:46pm UTC](https://colorlibsupport.com/t/centered-main-navigation-bar-for-activello-wordpress-theme/8540/6 "2016-02-01T14:46:04Z")

</div>

Thanks so much for the quick response! That worked perfectly. 🙂

---

<div class="post-metadata">

**Author:** ![movin](https://colorlibsupport.com/user_avatar/colorlibsupport.com/movin/32/10922_2.png) [@movin](https://colorlibsupport.com/u/movin)\
**Post date:** [February 2, 2016, 9:39am UTC](https://colorlibsupport.com/t/centered-main-navigation-bar-for-activello-wordpress-theme/8540/7 "2016-02-02T09:39:24Z")

</div>

You are most welcome here 🙂