小编rap*_*ael的帖子

DIV在水平滚动DIV中不垂直对齐

我试图做一个<div>只有水平滚动,我通过使用实现了这一<span>s的white-space: no-wrap;内<div>用overflow-x: scroll;.问题是我不能在这些内容中使用包含文本的段落<span>,因为它会破坏Chrome中的布局.

这些是我想要的(在Firefox中有效)以及我在Chrome中所拥有的内容:

每当段落文本包含在<span>s中时,就会出现问题.

这是我的HTML和CSS:

.info {
  width: 250px;
  height: 200px;
  float: left;
}
.list {
  height: 200px;
  overflow-x: scroll;
  overflow-y: hidden;
  white-space: nowrap;
}
.item {
  height: 175px;
  width: 175px;
  display: inline-block;
  margin-left: 5px;
  overflow: hidden; /* without this, the layout breaks in Firefox, too */
}
.item * {
  white-space: normal;
}

Run Code Online (Sandbox Code Playgroud)

<div id="listOne red">
  <div class="info blue">
    <p>Info regarding this list of …

Run Code Online (Sandbox Code Playgroud)

html css scroll

rap*_*ael

2016 01-04

6
推荐指数

1
解决办法

6031
查看次数

标签统计

css ×1

html ×1

scroll ×1

DIV在水平滚动DIV中不垂直对齐

标签 统计

小编rap_ael的帖子

标签统计