Html 简单CSS浮点问题

我有一个简单的问题，图像放在文本下，而不是放在文本旁边

标记如下所示：

<div class="footer">
     <p>bla bla bla bla</p>
     <a href="url_here" class="next" title="Next"><span>Next</span></a>
</div>

div.footer p {
    color: #FFF;
    width: 80%;
    margin: 0 auto;
    padding:0;
    border: 1px solid white;
}
div.footer a.next {
    background-repeat:no-repeat;
    display: block;
    float: left;
    margin-left: 2em;
    height: 52px;
    width: 24px;
    background-image: url('../gfx/arrow-right.jpg');
    margin-left: .7em;
}
div.footer a.next span {
    display: none;
}

该段落似乎想将链接推到它下面，而不是在它旁边的自由空间中浮动。有什么想法吗？

只有80%的宽度，因此它有很大的空间来显示链接

---

Cheers

段落是块级元素，它将强制自己位于最后一个元素之后的新行上，并强制下一个元素位于新行上

如果你想把链接放在左边（锚点上有一个float:left），试着将段落向右浮动

试一试

看

如果希望锚点浮动到段落右侧，请将锚点移动到段落之前，并在锚点标记上放置一个float:right

编辑： 要使锚点位于右侧，请在html和float中首先使用锚点：右侧请参见

---

如果不想更改html，请将段落向左浮动，将锚点向左浮动。请参见

段落是块级元素，它将强制自己位于最后一个元素之后的新行上，并强制下一个元素位于新行上

如果你想把链接放在左边（锚点上有一个float:left），试着将段落向右浮动

试一试

看

如果希望锚点浮动到段落右侧，请将锚点移动到段落之前，并在锚点标记上放置一个float:right

编辑： 要使锚点位于右侧，请在html和float中首先使用锚点：右侧请参见

---

如果不想更改html，请将段落向左浮动，将锚点向左浮动。请参见

您所描述的内容听起来像是“p”标记的正确行为。看见如果你不想要下面的链接，为什么不使用“div”而不是“p”标记呢？您应该能够将所有样式转换到新的div

更新： 我认为下面的HTML可以满足您的要求。为了简单起见，我内联了这些样式，您可能希望将它们移动到您的css文件中

<div class="footer">
     <div style="float:left">bla bla bla bla</div>
     <a href="url_here" style="float:right" class="next" title="Next">Next</a>
</div>

呜呜呜呜呜呜

您所描述的内容听起来像是“p”标记的正确行为。看见如果你不想要下面的链接，为什么不使用“div”而不是“p”标记呢？您应该能够将所有样式转换到新的div

更新： 我认为下面的HTML可以满足您的要求。为了简单起见，我内联了这些样式，您可能希望将它们移动到您的css文件中

<div class="footer">
     <div style="float:left">bla bla bla bla</div>
     <a href="url_here" style="float:right" class="next" title="Next">Next</a>
</div>

呜呜呜呜呜呜

事实上，我会这样做：

div.footer p {
    float: left;
    ...
}

---

事实上，我会这样做：

div.footer p {
    float: left;
    ...
}

---

p

是块级元素，因此除非将其浮动，否则后面的内容将位于其下方

---

您可以浮动段落，也可以在html中将链接放在段落前面。

p

是块级元素，因此除非浮动段落，否则段落后面的内容将位于其下方

---

您可以浮动段落，也可以在html中将链接放在段落前面。

我来这里是为了解决一个简单的浮点算术问题，所以我澄清了您的标题。；）干杯，谢谢你的澄清。我来这里是想找一道简单的浮点算术题，所以我澄清了你的题目。；）干杯，谢谢你的澄清。这似乎是最接近我想要的东西，但是，这仍然与链接包装离开。这样做的目的是让它浮动到可用空间的左侧，即div/段落的右边缘。这似乎是最接近我想要的，但是，这仍然会留下链接包装。目的是使其浮动到可用空间的左侧，即div/段落的右边缘。