0

我正在使用 Twitter Bootstrap 插件,目前主要是网格系统。

我正在尝试将一行放在另一行之上,为响应式设计做一些事情。

在 Chrome 中,这非常有效:

<div class="container">
    <div class="row">
        <div class="content">
            abcd
        </div>
    </div>
    <div class="row" id="moveUpRow">
        <div class="content">
            efgh
        </div>
    </div>
</div>

CSS:

.row {
    height: 200px;
}

#moveUpRow {
    margin-top: -200px;
}

但在 Firefox 和 IE 中,它们都忽略了负边距。我试过top: -200px了,但这只是向上移动,row而不是行下的所有元素。留下大片空白。

这个问题还有其他解决方案吗?或者关于如何“拉”行下方的任何内容的任何建议?

4

2 回答 2

1

我遇到了同样的问题。在我的情况下,我的第一行中有两个浮动元素,所以当我在第二行放置负边距时,它会移动整行。奇怪的是,它在 Chrome 中运行良好,但在 Firefox 中却不行。

尝试添加溢出:隐藏;如果是这样的话。

于 2014-10-21T08:25:06.560 回答
0

您发布的 HTML 和 CSS 在 Firefox 和 IE 中对我来说看起来不错,请参阅http://www.bootply.com/72944

也许您可以从仔细检查 CSS 文件的路径开始,并确保页面上的 HTML 没有其他问题?

祝你好运!

于 2013-08-08T19:31:08.303 回答