Question

我的Joomla模板中的

当然是包含的组件：

<jdoc:include type="component" />

此时填充父容器的整个宽度（带边距）。父容器具有从站点顶部延伸到组件底部的背景。我想要做的是在组件之后添加一个位置以在那里放置一个模块，但我希望它在组件旁边。

但是，一旦我创建了组件float:left并添加了width:80%或其他内容，那么新位置上的模块将浮动在组件旁边。但是，当我向组件添加100％以外的宽度并在组件开始之前停止时，父容器的背景会发生变化。

如何让组件的宽度小于100％，float:left的旁边有另一个位置，而不更改父容器的背景？

编辑：我想补充一点，我不能在父容器上使用overflow:hidden，因为如果我这样做，另一个元素将被剪裁。添加背景到组件和其他位置也不起作用，因为原始背景更宽。

Edit2：我找到了解决问题的方法。如果有人感兴趣，将来参考：this页面上的浮动清除部分描述了我的问题，并在最后一个浮动元素解决了我的问题后添加<div style="clear: both;"></div>来清除浮动。如果有人有更清洁，更好的解决方案，我很乐意看到它！

Answer 1

我不确定您使用的是哪个版本的Joomla，但如果它是3.x，那么您可以使用Bootstrap附带的clearfix类。在父元素的末尾添加一个清晰的div是一种更清晰，更有效的方法。只需将以下内容添加到父容器中即可：

class="clearfix"

如果您使用的是Joomla 2.5，则可以将以下内容添加到模板css文件中：

.clearfix:before,
.clearfix:after {
    content: '\0020';
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    zoom: 1;
}

然后添加上面提到的类。

希望这有帮助

在Joomla中现有的模块旁添加模块

1 个答案: