手风琴导航栏不响应移动设备

时间:2014-12-19 16:20:51

标签: html css responsive-design

我能够使用Accordion Nav栏在笔记本电脑/台式机上响应某个特定尺寸。但是,它对任何移动设备都没有响应。我遇到的另一个问题是它没有为桌面和移动设备显示Accordion菜单栏的图标。任何帮助将不胜感激,以解决我遇到的问题。

谢谢

响应式CSS:

/*This is the placeholder for responsive CSS that we will implement for mobile design*/

/* Smartphones ----------- */
@media screen and (min-width : 240px) and (max-width: 519px){
/* Styles */

#content{ 
float:none;
padding:0;
width: auto;
}

img{
max-width: 100%;
height: auto;
width:auto\9; /*for ie8*/
}

body{
float:left;
font-family: 'Fabrica';
}

#logo {
 margin-right:auto;
 max-width: 100%;
 height: auto;
 padding: 0;
}

 #wrapper{
margin: 0 auto;
}
#wrapper p{
text-indent: 0;
}

h1, h2, h3 {
font-family: 'Fabrica';
} 

nav{
position: relative;
min-height: 40px;
}

nav ul{
position:absolute;
width: 180px;
padding: 5px,0;
top: 0;
left: 0;
border: solid 1px #aaa;
background: #fff url(.../img/menu-bar-mobile.jpg) no-repeat 10px 11px;
border-radius: 5px;
box-shadow: 0 1px 2px rgba(0,0,0,.3);
}

nav ul:hover li{
display: block;
margin: 0 0 5px;
}

nav a:hover {
display:block;
}

nav li{
display:none;
margin:none;
}

#banner{
display: none;
}

footer{
font-family: 'Fabrica';
float:left;
}
}

0 个答案:

没有答案