nav bar main menu centring

  • Hello – I’m currently trying got center the main menu navigation bar centrally in a responsive manner.
    https://www.pixiesinthecellar.co.uk

    at the moment it’s kind of fudged in that it’s centred on a desktop screen in style sheet css
    <div class=”collapse navbar-collapse navbar-responsive-collapse” style=”width:100%;padding-left:300px”>

    but on 768px screen it aligns to the right. Fine on smaller screens as it goes to the responsive type menu

    In bootstrap css
    I’ve tried changing all the nav left to centre and float to none, but then all tabs align below each other.

    Any help would be much appreciated as code is pretty new to me :/ Thanks

Viewing 2 replies - 1 through 2 (of 2 total)

  • Remove the padding off the .collapse div you mention then add the following css to a child theme.

    .navbar-nav {
float: none;
margin: 0;
text-align:center;
}
    .navbar-nav > li {
float: none;
display: inline-block;
}
    Thread Starter PixiesintheCellar

    (@pixiesinthecellar)

    Wow – truly amazing :))))

    Thanks a million times over, my head hurts with trying to do this for the past few days!

    It’s a beer for you Creatrix :)))

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘nav bar main menu centring’ is closed to new replies.