css 如何使bootstrap 3中的展开/折叠严格水平

jk9hmnmh 于 2022-11-27 发布在 Bootstrap

关注(0)|答案(1)|浏览(205)

我正在使用bootstrap 3。我的想法是通过点击一个按钮来展开/折叠其他单词之间的一些单词（字典中的转录）。
单词和它们之间的转录都有类display: "inline-block"。它有一种方法，使严格的水平过渡，并避免这种显示：“块”的一部分，它？面板标题应始终在一行。（并避免写额外的js）

<div class="panel-heading">
          <div class="note">{{note}} </div>
          <div class="word -arabic-text-big">{{word}}</div>
          <div class="collapse transcription">[******]</div>
        </div>
        <button type="button" class="btn btn-info" 
            data-toggle="collapse" data-target=".transcription">
        Transcipt
        </button>

css

来源：https://stackoverflow.com/questions/45781384/how-to-make-expand-collapse-in-bootstrap-3-stricly-horizontal

1条答案

按热度按时间

o4hqfura1#

对不起，答案太简单了。但在我做错事之前...

.note, .word, .transcription {
    display: inline-block;
}

.transcription.collapse.in {
    display: inline-block;
}
.transcription.collapse {
    display: none;
}

赞(0）回复(0）举报 2022-11-27

我来回答

css 如何使bootstrap 3中的展开/折叠严格水平

1条答案

相关问题

热门标签

最新问答