아코디언을 기초 위에 탭으로 사용합니다.

Question

저는 Zurb Foundation 4 (최신 릴리스)에서 작업 중이며 탭으로 레이아웃을 만들려고하고 있으며 각 탭에는 아코디언 레이아웃이있는 섹션이 있습니다. foundation sections docs and examples

탭 :

<div class="section-container tabs" data-section="tabs"> 
    <section> 
    <p class="title" data-section-title><a href="#">Section 1</a></p> 
    <div class="content" data-section-content> 
     <p>First Accordion-ed content goes here.</p> 
    </div> 
    </section> 
    <section> 
    <p class="title" data-section-title><a href="#">Section 2</a></p> 
    <div class="content" data-section-content> 
     <p>Second Accordion-ed content goes here.</p> 
    </div> 
    </section> 
</div> 

아코디언 :

<div class="section-container accordion" data-section="accordion"> 
    <section> 
    <p class="title" data-section-title><a href="#">Section 1</a></p> 
    <div class="content" data-section-content> 
     <p>Content of section 1.</p> 
    </div> 
    </section> 
    <section> 
    <p class="title" data-section-title><a href="#">Section 2</a></p> 
    <div class="content" data-section-content> 
     <p>Content of section 2.</p> 
    </div> 
    </section> 
</div> 

내가 볼 결과, 각 섹션 (아코디언 O 탭)는 항상 탭, 깨진 동작입니다.

I는 탭을 포함하는 탭의 예를 볼 수있는 이러한 다른 question

관련 이러면 있지만 (예를 들면 수평 탐색과 수직 탐색 또는 아코디언 탭) 혼합 섹션 아무도.

누구나 작동시킬 수 있습니까? 가능한 경우 기본 프레임 워크의 다른 도구를 사용하지 않고.

감사합니다.

는

편집 :

여기에 답장을 보내 주시기 바랍니다 또는 here 내가 아른 올바른 응답을 연결합니다.

편집 2 : 이미 확인 된 문제는 GitHub에서 확인되지 않았습니다.

Answer 1

마지막으로 작동합니다. 그래서 해결책은 모든 감사의

첫째는 issue

에서 도와 @codeZeilen 및 @piercemoore을 @onecreative 할을했다 :

• 복제 최신 버전 github repo
• 이동에서의 로컬 복사본에 복제 된 repo
• css 폴더를 만드십시오
• 최신 sss 부호에서 아주 새로운 css를 생성하기 위하여 sass/compass를 설치하십시오. sass --watch scss/:css/

• 수정 프로그램을 추가합니다 :

• 는 CSS 파일을 생성

  .accordion > section > .content { border: none !important; }

  .accordion > section.active > .content { display: block; position: relative;}

• 저장하고 다시로드, 그것은 준비! 내부 중첩 아코디언 아코디언과 scss hack to properly fix at scss level 및 jsfiddle 예, like this one working example 등과 같은 다른 상황에 대해서는

; 이 부분을 참조하시기 바랍니다 issue github