更改下拉菜单位置

时间:2016-03-17 19:52:07

标签: css responsive-design html-lists

我想知道当网站的最小尺寸时如何更改下拉菜单的位置。 当在计算机或平板电脑上查看www.whnetv.com时,通道的下拉列表应位于应有的位置。但是在iphone或最小的浏览器窗口中,下拉选项显示在菜单的左侧。

由于

1 个答案:

答案 0 :(得分:0)

CSS菜单无序列表<ul>具有基于其父级的绝对定位。

#menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: none;
    position: absolute;
    top: 35px;
    left: auto;
    z-index: 99999;
    background-color: #444;
    background-image: linear-gradient(#444, #111);
    -moz-border-radius: 5px;
    border-radius: 5px;
}

您需要根据检测到的屏幕大小更改此定位,使用能让您的页面像媒体查询一样响应的内容:

http://www.w3schools.com/css/css_rwd_mediaqueries.asp