首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >为什么我的大疱列包装,尽管没有是-多行集?

为什么我的大疱列包装,尽管没有是-多行集?
EN

Stack Overflow用户
提问于 2018-03-13 07:13:58
回答 1查看 2.4K关注 0票数 2

我使用Bulma进行列管理,它有一个is-multiline类,可用于允许列包装。但是,我没有使用这个类,但是我的列仍然在包装。

预期行为:

两列总是并排的,在同一行上。

实际行为:

在特定的视口宽度时,第二列位于第一列的下方而不是旁边。

问题

如果你熟悉Bulma,你介意看看这个简单的例子,让我知道我做了什么明显的错误吗?非常感谢!

HTML

代码语言:javascript
运行
AI代码解释
复制
<div class="body">
  <div class="columns">
    <div class="column row-name is-narrow">
      Row 1
    </div>
    <div class="column row-cells">
      Some data
    </div>
  </div>
</div>

CSS

代码语言:javascript
运行
AI代码解释
复制
.body {
  width: 600px;
  background-color: #000;
  margin: 0 auto 0;
}
.row-name {
  background-color: #ffff0088;
  width: 50px;
}
.row-cells {
  background-color: #ff000088;
}

A JSFiddle:https://jsfiddle.net/8ggyagxp/10/

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-03-13 07:47:22

结果是,如果Bulma检测到您的视口是移动大小的,它将堆叠列,除非列上存在is-mobile类。有关详细信息,请参阅这里

票数 5
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/49259699

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文