清除：两个覆盖边距：0自动？

我遇到了一个我需要处理的定位问题。在容器div中我有两个div，它们都应该水平居中。但是，我遇到了第二个div的定位问题。清除：两个覆盖边距：0自动？

如果我添加明确：两个div 2获取一个新行，这是所需的。但是，如果使用清除：两个边距：0自动;不起作用。我可以用什么来使div居中？

HTML：

<div class="row-fluid"> 
    <div class="span6 offset3 text-center header"> 
     <h1>Title...</h1> 
     <p>Text...</p> 
    </div> 
    <div class="span3 offset4"> 
     <form> 
      ... 
     </form>     
    </div> 
</div>

CSS：

.register .span3 { 
    width: 270px; 
    clear: both; 
    margin: 0 auto; 
}

输出：

- Without clear:both 
____________________________________ 
|         | 
|    ______  ______ | 
|    |  |  |  | | 
|    | div 1|  | div 2| | 
|    |______|  |______| | 
|         | 
|         | 
|         | 
|         | 
|         | 
|         | 


- WITH clear:both 
____________________________________ 
|         | 
|    ______    | 
|    |  |    | 
|    | div 1|    | 
|    |______|    | 
| ______       | 
| |  |       | 
| | div 2|       | 
| |______|       | 
|         | 
|         | 

- Desired output 
____________________________________ 
|         | 
|    ______    | 
|    |  |    | 
|    | div 1|    | 
|    |______|    | 
|    ______    | 
|    |  |    | 
|    | div 2|    | 
|    |______|    | 
|         | 
|         |

来源

2013-08-26 holyredbeard

您是否使用了像Bootstrap这样的CSS框架？ –

我看起来没问题。也许还有一些其他的引导CSS正在被应用。 – Jeffpowrs

@MarcAudet：是的，我使用Bootstrap。 – holyredbeard

据我所知，Bootstrap的网格系统使用浮动来定位页面上的元素。

唉，如果是float: left;那么margin: 0 auto;不会放在页面的中心。它会漂浮在左边。您的div显示偏离左侧的原因是因为它们应用了offset-3/offset-4类。

要将div元素放在页面的中间，我怀疑你需要跳出Bootstrap的网格框架并做自己的事情。

来源

2013-08-27 11:25:27

为什么你需要Ç当你不漂浮时，学习？明确仅适用于浮动情况。

如果删除明确：既和仅插入保证金：0汽车，双方的div将页面，一个在另一个之下，你的愿望的中心。

来源

2013-08-26 14:12:55 gespinha

OP使用Bootstrap，它使用浮动来创建布局。 –

清除：两个覆盖边距：0自动？

回答

相关问题