السلام عليكم
مساعدة في تكوين قائمة منسدلة باستعمال CSS
والخطأ موضح في المرفقات
وهذا هو كود القائمة
<html>
<div id="wrapper">
<div id="menu">
<ul>
<li><a href="#">الرئسية</a></li>
<li><a href="#">أقسام الموقع</a>
<ul>
<li><a href="#">المقالات العامة</a></li>
<li><a href="#">المقالات المنهجية</a></li>
<li><a href="#">المقالات الحديثية</a></li>
<li><a href="#">المقالات الفقهية</a></li>
<li><a href="#">المقالات الأسرية</a></li>
</ul>
</li>
<li><a href="#">المنتدي</a></li>
</ul>
</div>
</div>
<style>
#menu{
list-style: none;
width: 1850px;
margin: 30px auto 0px auto;
height: 53px;
padding: 0px 20px 0px 20px;
/*rounded corner*/
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
/*background color and gradients*/
background:#014464;
background:-moz-linear-gradient(top,#0272a7,#013953);
background:-webkit-gradient(linear,0% 0%,0% 100%,from(#0272a7),to(#013953));
/*borders*/
border:3px solid #002232;
-moz-box-shadow:inset 0px 0px 1px #edf9ff;
-wekit-box-shadow:inset 0px 0px 1px #edf9ff;
box-shadow:inset 0px 0px 1px #edf9ff;
}
#menu ul{
margin: 0px 5px;
padding: 0;
line-height: 30px;
}
#menu li{
margin: 8px 18px;
list-style: none;
float: right;
position: relative;
display:block;
}
#menu ul li a{
margin:0px 8px 10px 10px;
padding:0px 8px 10px 10px;
text-align: center;
font-family:sans-serif;
text-decoration:none;
font-size: 25px;
color:#000;
display: block;
border:0px solid #013953;
text-shadow:1px 1px 1px #000;
}
#menu ul ul{
position: absolute;
visibility: hidden;
width:125px;
top:25px;
}
#menu ul li:hover ul {
visibility: visible;
display: block;
}
</style>
</html>