Bootstrap button on navbar menu toggle

Aris1982
<nav class="navbar navbar-inverse navbar-fixed-top">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar" />
        <span class="icon-bar" />
        <span class="icon-bar" />
      </button> <a class="navbar-brand" href="#">QA</a>
      <button type="button" class="btn btn-default navbar-btn">Sign in</button>
    </div>
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li class="active">
          <a href="#">About<span class="sr-only">(current)</span></a>
        </li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Menu<span class="caret"/></a>
          <ul class="dropdown-menu">
            <li>
              <a href="#">Action</a>
            </li>
          </ul>
        </li>
      </ul>
    </div>
  </div>
</nav>

My question is the following: Is it possible in Bootstrap to have the button from the navbar inside the toggle menu as a link and not as a button? Lets say the user goes from desktop to mobile resolution and he clicks the hamburger menu and the link 'Sign In' is displayed but not as a button anymore

enter image description here

J. Titus

Add hidden-xs class to the button in your nav bar

<button type="button" class="btn btn-default navbar-btn hidden-xs">Sign in</button>

Add a menu item with class visible-xs somewhere in your menu

<li class="visible-xs"><a href="#">Sign In</a></li>

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

Bootstrap Navbar toggle button not working

Toggle button collapse not working in Bootstrap navbar in bootstrap

Bootstrap 4 navbar toggle button not working correctly

Bootstrap navbar toggle button doesn't work

Toggle button collapse not working in Bootstrap navbar

Bootstrap navbar collapse toggle button not clicking

Bootstrap navbar toggle button stopped working

Bootstrap Navbar Toggle button not showing content

Issue with Bootstrap Navbar Toggle Button not working

Is there a way to add the navbar-toggle button in bootstrap as a fixed button on the screen?

Navbar Menu toggle button does not come on extreme right when collapsed

Bootstrap 3.3.2 navbar dropdown menu toggle not clickable on mobile or desktop

NavBar Bootstrap 5 Toggle hamburger Menu doesn't show items

Bootstrap navbar will disappear when clicking the toggle button on small devices

How to move navbar toggle button and logo to the left in Bootstrap?

Bootstrap Navbar toggle icon button not showing nav items on click?

Twitter Bootstrap 3 navbar toggle button with different icon

bootstrap navbar toggle button moving left when clicked

Bootstrap 3 Navbar toggle - collapses but button does not appear

Bootstrap 4 -- Moving links to the right of the navbar with a toggle button

Bootstrap navbar toggle button disappears on smaller screen sizes

Bootstrap navbar toggle button not working correctly (HTML inside)

Right align navbar toggle button and list items in Bootstrap 5

Bootstrap Navbar toggle will not expand

Bootstrap navbar toggle is not expand

Bootstrap navbar toggle not working

Bootstrap Horizontal Navbar Toggle

Navbar Toggle Direction in Bootstrap

Bootstrap navbar unable to toggle