右侧浮动水平对齐

Question

这让我很精神 为什么我的第三个div（content-col-text）不能正常浮动？
它与gallery-thumb-container保持对齐？我需要它向右和向上并与大图像容器对齐 - 这是外部div包装器（入口内容）的位置.. 我甚至没有任何奇怪的边缘内容......

Answer 1

您的订单不正确。您需要将其更改为如下工作。

以下是代码：

HTML：

<div class="large-image-container">&nbsp;</div>
<div class="content-col-text">&nbsp;</div>
<div class="gallery-thumb-container">&nbsp;</div>

CSS：

.large-image-container{float:left; width:66%; background:red;}
.gallery-thumb-container{float:left; width:66%; background:yellow;}
.content-col-text{float:right; width:31%; background:green;}

小提琴演示：

<强> DEMO

通常，在这种情况下，当您使用clear:both;时，浮动会得到纠正并且运行正常。

希望这有帮助。

Answer 2

你的gallery-thumb-container可能已被强行关闭，因为它向左浮动，large-image-container右侧没有更多空格。

您可以尝试切换<div>的顺序并将content-col-text秒放在第二位

另一种选择是绝对定位，但这会将其从文件流中取出......