2014-01-24 3 views
2

В моих недавних начинаниях я столкнулся с несколькими проблемами, касающимися Bootstrap 3. Вопрос касается аккордеонного элемента. Пример - это одна копия базового примера с начальной страницы.Bootstrap Accordion Height

<div class="panel-group" id="accordion"> 
    <div class="panel panel-default"> 
     <div class="panel-heading"> 
      <h4 class="panel-title"> 
       <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne"> 
        Collapsible Group Item #1 
       </a> 
      </h4> 
     </div> 
     <div id="collapseOne" class="panel-collapse collapse in"> 
      <div class="panel-body"> 
       Anim pariatur cliche reprehenderit, enim eiusmod..... 
      </div> 
     </div> 
    </div> 
    <div class="panel panel-default"> 
     <div class="panel-heading"> 
      <h4 class="panel-title"> 
       <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo"> 
        Collapsible Group Item #2 
       </a> 
      </h4> 
     </div> 
    </div> 
</div> 

Основная проблема - высота. высота тела 100%, конец, например, collapseOne - это 100%, но он обрабатывает его до уровня контента, стандартный! Важно не помогает только, например, 600px растягивает его, что неудовлетворительно. Примеры JS в предыдущих вопросах не работают, потому что они основаны на Jquery ui. У вас есть решение на основе CSS?

+1

Вы можете реплицировать в http://jsfiddle.net? –

ответ

1

Панели для обрушения, когда они открыты, имеют встроенный стиль height:auto, что позволяет сжимать содержимое. Я не уверен, чего вы пытаетесь достичь, но это подсказка, почему высота не то, что вы ожидаете.

Просьба написать скрипку и получить дополнительную информацию о том, чего вы пытаетесь достичь.

+0

Попытка переопределить высоту по умолчанию: автоматическое поведение и установить ее высоту: 100% – harpomarx