Question

我正在尝试在x轴而不是y轴上制作内容类型（application_formulier）scrollabel的预告片视图。我为此做了一个观点（view-view-s4p）。

使用CSS我得到以下内容：

.view-view-s4p{
margin-left:-50px;
max-width:920px;
min-width:920px;
height:260px;
overflow:auto;
overflow-y:hidden;
}
.view-view-s4p .view-content {
margin:0 -32767px 0 0;/* browser limit */
height:240px;
}
.view-view-s4p .view-row{
float:left;
}

我现在有滚动工作，但它已经超过了最后一篇文章......任何关于如何解决这个问题的想法。

转到此链接可查看我的问题图片： https://www.dropbox.com/s/7sse3shk08ex9g6/problem.PNG

（顺便说一句：如果我不允许改变我的问题，请告诉我。）

Answer 1

您需要将white-space:nowrap;属性添加到样式表中：

.view-view-s4p{
  margin-left:-50px;
  width:auto;
  min-width:960px;
  max-height:253px;
  overflow-y:hidden;
  overflow-x:scroll;
  white-space:nowrap;
}

Demo

Answer 2

以下是您如何做到这一点的示例：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style type="text/css">
.wrap {
    overflow:auto;
    width:600px;
    height:220px;
    padding:10px;
}
.inner {
    float:left;
    margin:0 -32767px 0 0;/* browser limit */
}
.inner div {
    width:200px;
    height:200px;
    margin:0 10px;
    background:red;
    float:left;
}
</style>
</head>
<body>
<div class="wrap">
        <div class="inner">
                <div>test</div>
                <div>test</div>
                <div>test</div>
                <div>test</div>
                <div>test</div>
                <div>test</div>
        </div>
</div>
</body>
</html>

Source

如何使内容类型的帖子水平滚动？

2 个答案: