文字不在我的中心

Question

演示链接

不知道为什么我在第二个列表中的文本没有集中.

HTML

<div id="the_target">
    <ul>
        <li>Stephen Marston</li>
        <li>Account Exectutive</li>
        <li>The Company</li>
    </ul>
</div>

上海社会科学院:

section {
    #the_requestor {
        margin-top: 40px;
        ul { margin-top: 10px; }
        ul li {
            text-align: center;
            line-height: $px20;
        }
        li:first-child {
            font-family: LatoBold;
            font-size: $px30;
            background: cyan;
        }
    }
    #the_target {
        position: relative;
        margin-top: 40px;
        ul { margin-top: 10px; }
        ul li {
            text-align: center;
            line-height: $px20;
        }
        li:first-child{
            font-family: LatoBold;
            font-size: $px30;
            background: cyan;
        }
    }
}

关于什么可能迫使斯蒂芬马斯顿不在中心的任何想法？

Answer 1

有一个正在浮动的元素正在#mobile-action-area干扰.你需要清除这个浮动.有多种方法可以做到这一点.添加overflow: hidden到#mobile-action-area修复它.您也可以尝试:

#mobile-action-area:after {
    display: table;
    content: "";
    clear: both;
}