부트 스트랩 navbar 오른쪽 정렬 버튼

Question

이상한 (아마 나는 이것을 이해하지 못함) 문제에 빠지게됩니다. 나는 맨 (navbar-inverse navbar-fixed-top)에서 네비게이션 바에서 퍼팅, 또한 같은, 오른쪽 정렬의 몇 가지 링크를 넣어하려고 해요 :

<div class="navbar-collapse collapse"> 
    <ul class="nav navbar-nav"> 

     <li><a href="#">designs</a></li> 
     <li><a href="#">designers</a></li> 
     <li><a href="#">buy</a></li> 
     <li><a href="#">about</a></li> 

    </ul> 
    <ul class="nav navbar-nav navbar-right"> 

     <li><a href="/login">login</a></li> 
     <li><a href="/register">sign up</a></li> 

    </ul> 
</div> 

[http://www.bootply.com/dywf7Buv1u]이 작동

잘하지만, 경우 오른쪽에 정렬 된 요소 중 하나를 링크 안쪽에 래핑 된 단추로 변경 한 다음 건초 더미로 간다.

대신에 :

<li><a href="/register">sign up</a></li> 

내가 넣어 :

<li><a href="/register"><button type="button" class="btn btn-primary btn-small btn-nav">Sign up</button></a></li> 

가 [http://www.bootply.com/DjNB53gJao#]

당신은 버튼도 다른 모든 것들보다 낮은 경우 수직 오프셋을 볼 수 있습니다 navbar의 전체 수직 높이를 늘립니다.

<button>을 <li> 안에 넣고 <a>을 감싸지 않으면이 문제가 발생하지 않습니다. 이상한 일이 생길 때마다 <a> 주위에 <button>

아이디어가 있으십니까? 감사!

Answer 1

좀 이상하지만 버튼을 표시하는 목록 항목에 .btn-nav 클래스를 추가해야합니다.

그런 다음 버튼 요소에 버튼을 넣은 다음 버튼에 .navbar-btn을 추가하십시오.

the demo here을 참조하십시오.

희망이 있습니다.