0

我正在使用 7.x-56 zen 子主题更新基于 D7 构建的站点。主题布局为响应式水平堆叠的内容区域。我创建了一个自定义博客内容类型，以及基于分类、存档和最近帖子的三个视图块，但我在内容区域内各个块的布局方面遇到了问题。

我想要的是三个博客内容过滤块堆叠并向右浮动，而博客本身向左浮动。我或多或少地完成了这个，但是浮动和清除块以堆叠在一起，但我遇到的问题是它们以某种方式影响了第一篇博文的高度。在此处输入图像描述 那么，为什么浮动元素会影响视图行的高度，我该如何解决呢？您可以在此处查看该站点的实时版本，在此处输入链接描述。对于上下文，页面是从自定义内容类型构造的视图，过滤器视图使用上下文模块放置，行高为 -9。我应该在这里添加一个侧边栏区域吗？或者是否有针对此的 css 修复？

4

1 回答 1

1

我会给主博客区域一个宽度 %，然后将其浮动到左侧。对于右侧堆叠的 div，我会将它们全部放在一个 div 中，将该 div 浮动到右侧，然后给该 div 一个宽度 %。

然后确保将包含这两个 div 的 div 设置为 "overflow:auto";

#main {
  overflow:auto;
}

#left {
  float:left;
  width:65%;
}

#right {
  float:right;
  width:30%;
}



<div id="main">
    <div id="left"></div>
    <div id="right">
        <div id="box-1"></div>
        <div id="box-2"></div>
        <div id="box-3"></div>
    </div>
</div>
于 2016-11-21T18:25:21.447 回答