css - 李宽不工作

Question

试图通过限制其宽度在列中显示 wordpress 菜单项内的文字。不能让它工作。我尝试了“宽度:”，我尝试了“最大宽度:”，添加了“!重要”。我试着把它放进 li，我试着把它放进 li a。什么都没用。

直播链接在这里 http://soloveich.com/pr2-2/

html代码

<div id="mainpage2">
<ul>
    <li>
    <?php wp_nav_menu( array( 'theme_location' => 'main-menu'  ) ); ?>
</ul>
</li>
</div>

和CSS

#mainpage2 ul {
    list-style: none;
}

#mainpage2 ul li {
    display: inline;
}

#mainpage2 ul li a {
    max-width: 200px;
    font-size: 40px;
    font-weight: bold;
    text-align: center;
    font-family: verdana;
    color: #fff;
}

Answer 1

当您将 LI 设置为“display: inline”时，它不会占用宽度。要为内联元素指定宽度，请使用 display: inline-block，或使用 display: block 使其成为 block 元素。