기초 5 메뉴 항상 반응

Question

나는 나의 wordpress 주제에서 responsivenes를 위해 foundation5를 사용하고있다. foundation5에서는 메뉴가 큰 해상도에서도 반응 형으로 보이도록 정의합니다. 현재 73.2142857143em까지 붕괴되었습니다. 너비가 2000em 인 경우에도 메뉴를 항상 축소해야합니다.

여기 내 HTML.

<section id="navBar"> 
<div class="contain-to-grid clearfix sticky"> 
    <nav class="top-bar" data-topbar role="navigation" data-options="sticky_on: large;"> 
     <ul class="title-area"> 
      <li class="name">logo</li> 
      <li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li> 
     </ul> 
     <section class="top-bar-section"> 
      <ul id="menu-top-menu" class="top-bar-menu left"><li id="menu-item-567" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item active menu-item-567 active"><a href="http://url.loc/coming-soon/">Search</a></li> 
       <li id="menu-item-570" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-570"><a href="http://url.loc/kategorie/">Category</a></li> 
       <li id="menu-item-584" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-584"><a href="http://url.loc/faq/">Faq</a></li> 
      </ul>      </section> 
    </nav> 
</div> 

당신의 도움에 미리 감사드립니다.

Answer 1

CSS를 추가하면 도움이 될 수 있지만 미디어 쿼리 값을 메뉴의 응답을 원하는 너비로 변경하거나 기존 메뉴 css를 미디어 쿼리 내부의 CSS로 항상 응답합니다.

Answer 2

Foundation 5.5.3에서는 foundation.css을 업데이트하여 상단 바 중단 점의 너비를 변경할 수 있습니다. 다음 두 곳에서 나는 9999px에 중단 점을 변경하고 있습니다 (또는 당신이 원하는 무엇이든) :

변경 미디어 쿼리의 폭 :

@media only screen and (min-width: 9999px) { 
    .top-bar { 
    ...blah.blah.blah 

이 스타일을

meta.foundation-mq-topbar { 
    font-family: "/only screen and (min-width:9999px)/"; 
    width: 9999px; 
} 

그 그러나 작동하지 않을 경우, 사용중인 Foundation 5의 버전을 알려주십시오 (WordPress 테마에서).