html - Div 元素不向左浮动

Question

我写了一个响应式页脚，如屏幕截图所示:

文本 HELP 和 back icon 没有向左浮动，而是在中间被击中。我怎样才能将它移到左边？
这是代码:
HTML代码:

<div id = "footer">

                <span id = "logout" class="pull-right">
                   <span id = "logoutIcon"></span>
                    <span id = "logoutText">
                        LOGOUT
                    </span>
                </span>

                <span id = "logout1" class="pull-right">
                   <span id = "logoutIcon1"></span>
                    <span id = "logoutText1">
                        HELP
                    </span>
                </span>

            </div>  

CSS代码::

#footer {
            background-color: #125e9a;
            bottom: 0;
            height: 5%;
            position: absolute;
            width: 100%;
        }  
#logout1 {
        display: block;
        height: 100%;
        margin-left: 3%;
        padding: 2.5%;
        width: 30%;
    }
    #logoutIcon1 {
        background-image: url("../JunosImages/mob/back-arrow_normal_tab.png");
        background-repeat: no-repeat;
        background-size: 100% 100%;
        display: block;
        float: left;
        height: 14px;
        margin-top: 2%;
        width: 10px;
    }
    #logoutText1 {
        color: #fff;
        float: left;
        font-size: 14px;
        font-weight: 600;
        margin-left: 7%;
    }  

Answer 1

您向右拉了两个按钮。只需将第二个按钮中的 pull-right 类替换为 pull-left 并交换这些按钮。

还有 don’t use ID selectors in CSS .