考虑下面的jsFiddle：
@L_301_0@
HTML：
<div id="container">
<div class="char">
AAA
</div>
<div class="char stickToRight">
BBB
</div>
</div>
CSS：
#container {
border:solid 2px green
}
.char {
display: inline-block;
border: solid 2px red;
}
.stickToRight {
float: right
}
是否有另一种方法使.stickToRight对齐，不浮动？
我需要将其保持为display：inline-block，以便使其垂直对齐与其他.char元素一致。
如何实现浮点数：右对齐效果，同时保持元素显示：inline-block？ (请注意，我不知道容器元素的宽度。)
我想要纯粹的CSS解决方案，如果有的话。
解决方法
元素不能同时嵌入和浮动。
当元素设置为内联块时，它与显示不同：内联元素，它可以指定宽度和高度。然而，它仍然是内联布局流程的一部分 – 其水平位置由其源级别和其块级父级的text-align属性确定，并且其垂直位置与该行的垂直位置由vertical-align属性确定。
当元素浮动时，它不再是内联布局流程的一部分。它的水平位置是由左侧还是右侧浮动确定，以及是否还有其他浮动元素，其垂直位置由Eric Meyer在CSS中非常好地描述的相当一套规则确定：“最终指南”，但是这基本上归结为“如果没有浮动就会出现的内联框的顶部”。
我仍然不太确定你想要的是什么视觉效果，当你想要元素浮动和嵌入在同一时间，但浮动布局是不同的在线框布局水平和垂直立场，没有任何办法结合起来。
