两个元素拒绝浮动到第三个

Question

我一直在试图解决什么应该是一个简单的浮动/行内块CSS问题几天现在，我已经将元素人格化为点。难题如下：

我已将3个简码全部放在我网站上的中心对齐<p>标记中。它们如下：

• 甲 = [shortcode_for_a_left_sidebar]
• 乙 = [shortcode_for_a_figure]
• Ç = [shortcode_for_a_right_sidebar]

甲是float: left， B（主要这三个简码的一部分）设置为：

display: block; 
margin: auto; 

和Ç，这个可怜的家伙，是float: right。

我想这三个简码依偎为：

ABC，所有在同一行。

A，像往常一样合群，在B的左边空白处没有问题。另一方面，C被推到下面的行！它看起来像：

AB 
    C 

Ç肯定适合内乙的右页边距，但不会站在肩膀对肩膀。我无法弄清楚为什么代码会这样做。因为它们在同一行/包裹在同一个标​​记中，所以不应该B的余量自动调整为让C in？

我已经梳理了一堆类似的案例，答案似乎总是实施我已经实施的。我怎样才能让这三个人成为朋友？

///这里是活链接到pesky floating elements.

Answer 1

为了使一个元素浮动权“肩到肩”，你必须把它未在HTML浮动内容之前：

<div id="my-float-left"></div> 
<div id="my-float-right"></div> 
<div id="my-not-floating-content"></div> 

在你的情况，你就必须把<figure>以上.otw-sidebar-2股利。