溢出:在我的响应式菜单上滚动不起作用。该怎么办?

时间:2018-05-08 05:09:06

标签: html css responsive-design overflow

我的自适应菜单的overflow: scroll;属性不起作用。我无法理解哪个属性/属性会阻止它应用。

以下是标题的响应式CSS属性:

header .menu_icon{
    display: block;
}

ul.social{
    display: none;
}

header nav{
    display: block;
    background: #353434;
    margin: 21px 0 0 0;
    padding: 0;
    border-left: 0;
    border-top: 1px #2c2c2c solid;
    text-align: center;
    position: relative;
    z-index: 9999;
    display: none;
    overflow: scroll;
}
header nav{
    border-bottom-left-radius: 2px;
    -webkit-border-bottom-left-radius: 2px;
    -moz-border-bottom-left-radius: 2px;
    -o-border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    -webkit-border-bottom-right-radius: 2px;
    -moz-border-bottom-right-radius: 2px;
    -o-border-bottom-right-radius: 2px;


}
header nav.show_menu{
    display: block;

}
header nav ul li{
    margin: 0;
    width: 100%;
    border-bottom: 1px #2c2c2c solid;

}
header nav ul li:last-child{
    border-bottom: 0;
}
header nav ul li a{
    display: block;
    width: 100%;
    padding: 20px 0;
}
header nav ul li a:active{
    display: block;
    width: 100%;
    padding: 20px 0;
    background: #2c2c2c;
}

我在overflow: scroll;中添加了header nav。即使我已经尝试为每个元素添加此属性。它仍然无效。

以下是我的回复网站的屏幕截图: enter image description here

1 个答案:

答案 0 :(得分:0)

ADD:
overflow-y: scroll !important;并设置max-height: 100px !important;