0

这是我的代码：

<div class="contact">
<p class="size25">TOP 1% Realtors</p>

<p class="size16">32 years in real estate</p>

<p class="size16">Closed one home every 10 days in 2011 - 2012</p>

<p class="size16">Specializing in the 24/680 Corridor</p>

<p class="size16"><a href="mailto:example@aol.com">example@aol.com</a></p>

<p class="size25 phone">(510) 555.5555</p>
</div>

CSS：

.contact p{
    float:right;
}
.contact{
    color: #fff;
    display: block;
    width: 421px;
    height: 114px;
    position: absolute;
    margin-top: -96px;
    margin-left: 519px;
    font-family: 'Marcellus', serif;
    font-weight:300;
    line-height: 12px;
}
.contact a:link {
    text-decoration:none;
    color: #AC872F;
}
.phone{color: #AC872F}
.size25{font-size:25px}
.size16{font-size:16px}
.size14{font-size:14px}
.size11{font-size:11px}
.size10{font-size:10px}

图片：http: //imgur.com/LntF419

我希望右侧的文本正确对齐，并且每个

在它自己的线上。现在你可以看到电子邮件不是。这也是我第一次使用 twitter bootstrap，所以如果有什么可以帮助我的，请告诉我。

4

1 回答 1

0

添加clear: both到.contact p. 该clear属性删除与浮动元素一致的其他元素。

演示： http: //jsfiddle.net/q4YdC/（出于可见性原因，我删除了 div 边距）

于 2013-07-24T15:03:13.590 回答