我对float的使用不能按预期工作

Question

由于某种原因，我的浮动课程不起作用：

HTML：

<div class="col-md-5">
        <div class="BoxTitleSettings">
            <div class="left col-sm-6">
                Your Items
            </div>
            <div class="right col-sm-6">
                asuhido
            </div>
        </div>
        <div class="BoxSettings">

        </div>
    </div>

CSS：

.left {float: left;} .right {float: right;}

代码结果图片：

Answer 1

如果您希望右侧DIV的文字对齐，则必须将text-align: right添加到.right规则。

Answer 2

我可以看到你使用bootstrap，所以使用它的内置类FsmDef和pull-left。

pull-right

Answer 3

您不需要浮动只需尝试此代码：

<div class="col-md-5">
    <div class="row BoxTitleSettings">
        <div class="col-sm-6 text-left">Your Items</div>
        <div class="col-sm-6 text-right">asuhido</div>
    </div>
    <div class="row BoxSettings"></div>
</div>