导航菜单下拉把图片顶下去了
只是简单的导航，下面有一张图片，但不管怎么弄，下拉菜单一出来，图片就顶下去了，各位大神帮棒忙？
csdn的代码插入有问题，看不到实际的源代码，经典的css菜单就是父节点position relative定位，子菜单absolute定位，这样子菜单显示就不会占用空间导致图片下滑了。看你的css结构不是这样的，增加下面2个样式试试
#menu li {position:relative}
#menu li dl dd{position:absolute}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
无标题文档 .clearfloat{ clear:both; height:0; font-size:0; line-height:0; } a{text-decoration:none;} /*导航开始*/ #menu{ font-size:18px; margin:0 auto; width: 1202px; padding:0; background:#333; } #menu li{ float:left; padding:0; margin:0; width:120px; list-style:none; } #menu li dl{ border:1px solid #000; width:120px; margin:0; padding:0 0 5px 0; background:#333; } #menu li dl dt a{ display:block; color:#FFF; } #menu li dl dt{ margin:0; padding:10px 10px 5px 10px; text-align:center; background:#333; } #menu li dl dd{ margin:0; padding:0; color:#999; background:#666; } #menu li dl dd a{ display:block; color:#FFF; padding:5px 0px 5px 5px; } #menu li dl dd{ display:none; } #menu li:hover dd{ display:block; } #menu li dl dd a:hover{ background:#333; } #menu li dl dd a:active{ background:#000; } /*导航结束*/ /*图片开始*/ #picture{ width:1202px; position:absolute; left:auto; top:230; z-index:999 } /*图片结束*/ /**/ /**/ /**/ /**/
