浮动：正确弄乱了我的居中文本答案

【问题标题】：Float:right messing up my centered text浮动：正确弄乱了我的居中文本
【发布时间】：2012-10-03 14:47:22
【问题描述】：

当我的居中文本遇到浮动时，它使用浮动的边缘作为新边框，而不是页面的边缘。

例如，

<div style="float:right; width:60px; height:60px; background-color:blue"></div>
    <h2 style="text-align:center">Section 1</h2>
        <p>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.
        </p>
    <h2 style="text-align:center">Section 2</h2>
        <p>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.
        </p>
</div>

我怎样才能让两个h2的阵容？

【问题讨论】：

你想要什么......

标签： css

【解决方案1】：

<h2 style="text-align:center;margin-left:60px">Section 1</h2>

【讨论】：

【解决方案2】：

现在定义h2 margin:0;

像这样

h2{
margin:0;
}

Demo

【讨论】：

【解决方案3】：

将margin-right 和margin-left 添加到足够大的h2s，以便为浮动腾出空间，请参阅http://jsfiddle.net/3QRcn/1/。

【讨论】：