2016-11-10 1 views
0

내 웹 사이트 탐색 표시 줄의 드롭 다운 메뉴와 관련된 문제가 있습니다. 부트 스트랩을 사용하고 있습니다. v 3.3.6부트 스트랩에서 문제를 해결하는 navbar 드롭 다운

마우스를 가져 가면 메뉴 이름 (여기서는 기능입니다)에서 옆에있는 버튼처럼 보일 것이라고 기대합니다 (요청 데모 버튼). 마우스를 올리면 오른쪽 가장자리가 더 선명 해집니다. 나는 그물 위에서 많은 것을 서핑했으나 궁극적으로 나는 필요한 해결 방법을 찾지 못했다.

여기 내 코드는 왼쪽 완벽 어디에 있는지, "특징"라는 드롭 다운의 오른쪽은 매우 날카로운

<nav class="navbar navbar-default navbar-fixed-top"> 
<div class="container"> 
<div class="navbar-header"><%= image_tag("logo.png", alt: "industryPrime") %></div> 
    <ul class="navigation pull-right"> 

     <li class="dropdown"> 
     <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Features <span class="caret"></span></a> 
     <ul class="dropdown-menu"> 
     <li><a href="#" class="scroll-link" data-id="paperless_purchase_section">Paperless purchase</a></li> 
     <li><a href="#" class="scroll-link" data-id="efficient_stores_section">Efficient stores</a></li> 
     <li><a href="#" class="scroll-link" data-id="peace_of_mind_section">Peace of mind</a></li> 
     </ul> 
    </li> 
     <li class="req_demo"> 

     <%= link_to "Request Demo", user_request_demo_page_path , :onclick => "demo_clicked()" ,:onmouseover => "start_count()" , :onmouseout => "stop_count()" %> 
     </li> 
     <li id="Login button section"><%= link_to 'Login', {controller: 'sessions', action: 'new'} %></li> 



     <li><a href="#" class="scroll-link" data-id="contact">Contact Us</a></li> 
     <li><%= image_tag("contact_us.png") %>+91 98302-15353</li> 
    </ul> 
</div> 
</div> 
</nav> 

스 니펫입니다. 나는 그 오른쪽이 왼쪽과 같아야한다. 그리고 흑인 효과는 호버링 때문입니다. 다음 CSS 규칙을 포함 할 경우 오른쪽에있는 기능 상자가 일부 패딩을 받아야한다

The problem snapshot is here:

+0

버튼 컨테이너에 'overflow : hidden'또는 비슷한 것이있을 것으로 예상됩니다. 또한 - 추가 스타일 시트를 사용합니까? – oboer

+1

에는 CSS가 포함되어 있습니다. –

+0

그 외의 다른 부트 스트랩 css @ Ron.Basco – Abhradip

답변

0

,

<style> 
     .dropdown { 
      padding-right: 10px; 
     } 
</style> 

난 당신이 여기 템플릿 언어의 어떤 종류를 사용하고 있는지 의심을 가지고 있지만 당신이 언급하지 않은 것도 있습니다.

관련 문제