css - 水平 ul li 导航 Bootstrap

Question

我有带 bootsrap 的 ul li 导航，其中 li 具有固定宽度，我有很多 li，我想在移动设备上显示菜单的所有 li 元素(我不知道如何)

问题:我想在移动设备上以水平方式显示所有菜单，但它正在垂直，以及如何将所有元素放到小屏幕上

https://jsfiddle.net/fvove846/

Answer 1

你忘记了你的 css 中的 display:inline，

试试这段代码

.table_ul_nav{
    display: block;
    list-style: outside none none;
    padding-left: 40px;
    display: inline;
}
.table_ul_nav>li{
    width: 130px;
    display: inline-block;
    text-align: center;
    padding: 8px;
    margin-top: 10px;
    font-size: 18px;
    font-weight: bold;
    display: inline;
}