为什么要隐藏ol元素的overflow属性，让它在x轴方向尽可能的展开

Answer 1

float: left;

使您的

<li>

脱离文档的正常流程。这意味着它们不会影响其父元素的高度。当overflow属性设置为visible以外的值时，会建立一个新的块格式化上下文。这意味着父元素包含浮动元素，导致其扩展以包含它们。如果删除

overflow: hidden;

，则

menu_button_container

不会建立新的块格式化上下文，并且不会扩展以包含浮动元素。要解决这个问题，您需要清除浮动：

.menu_button_container::after {
    content: "";
    display: table;
    clear: both;
}