0

I am trying to align two buttons to the right of my navbar, and I cant seem to figure it out. Reading the bootstrap documents I have tried justify-content-end as well as pull-right on a div and not the buttons themself with no luck. Any help would be greatly appreciated.

        <nav class="navbar navbar-expand-md fixed top bg-light">
        <a class="navbar-brand">Logo</a>
        <ul class="navbar-nav">
            <li class="nav-item">
                <a class="nav-link">Lorem</a>
            </li>
            <li class="nav-item">
                <a class="nav-link">Ipsum</a>
            </li>
        </ul>
        <div class="pull-right justify-content-end">
            <button class="btn pull-right">Sign up</button>
            <button class="btn pull-right">Sign in</button>
        </div>
    </nav>

jsfiddle: https://jsfiddle.net/y8c5u3kL/2/

dmc94
  • 536
  • 1
  • 5
  • 16
  • `I am trying to align two buttons to the right of my navbar`. It's really on the right now. So, what's wrong? – Tân Nov 29 '19 at 01:45
  • I mean the far right of the navbar, so it would be essentially opposite of the "nav-items" – dmc94 Nov 29 '19 at 01:48
  • @dmc94 it seems like the "expand" class in your navbar is what is causing the isuse. if you remove it then your buttons align to the right. – j a Nov 29 '19 at 02:33
  • @dmc94 actually, you should use ml-auto instead. I marked your question as a duplicate because this has been answered in other places. but here is a working fiddle for you: https://jsfiddle.net/xy7f6dkv/1/ – j a Nov 29 '19 at 02:43
  • weird couldn't find it! but thank you this definitely worked! – dmc94 Nov 29 '19 at 03:11

0 Answers0