Bootstrap Accordion 不适用于 -xs- 列大小答案

【问题标题】：Bootstrap Accordion isn't working with -xs- column sizesBootstrap Accordion 不适用于 -xs- 列大小
【发布时间】：2014-08-25 22:00:18
【问题描述】：

我在本地 Bootstrap 网站上创建了一个手风琴。我在col-md-5、col-md-3 和col-md-2 类的collapse a href 中创建了三列。此时，链接仍然可以点击，并且手风琴功能齐全，只是在移动设备上看起来很糟糕。因此，我将类 col-xs-5、col-xs-3 和 col-xs-2 添加到以前的类中，现在每当新类为手风琴设计样式时，链接都不会单击。我什至尝试删除 -md- 类，但我认为它与 -xs- 类有关。有谁知道手风琴是否不支持 -xs- 类？

这是我的标记：

<div class="panel-heading">
    <div class="row">
        <h4 class="panel-title">
            <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
                <div class="col-xs-5 col-md-5">Introduction to the Linux Academy</div>
                <div class="col-xs-3 col-md-3 difficulty">Beginner</div>
                <div class="col-xs-2 col-md-2 time">01:00:36</div>
                <div class="col-md-2">
                   <a href="course-sub.php">
                      <button type="button" class="btn btn-default">Course Details!</button>
                   </a>
                </div>
            </a>
       </h4>
    </div>
</div>

谢谢！

【问题讨论】：

有点难以理解您在说什么，但我怀疑这是因为您的 <a> 由于子元素被浮动而没有宽度或高度。尝试将class='clearfix' 放在您的<a> 上，看看是否能解决问题。
是的，@joshhunt 是正确的。您需要清除浮动，以便您可以单击切换
@joshhunt，效果很好！感谢您的帮助！
不用担心，很高兴我能帮上忙。我已将我的评论作为答案发表，以便您可以将此问题标记为已回答。

标签： twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

我怀疑这是因为您的<a> 没有宽度或高度，因为子元素是浮动的。尝试将class='clearfix' 放在您的<a> 上，看看是否可以解决问题。

【讨论】：