PDA

View Full Version : ایراد منو



myysl97
دوشنبه 02 تیر 1393, 11:29 صبح
سلام دوستان ایراد منو من در کجاست
وقتی میرم روی زیر منو منو اصلی دیگه دیده نمیشه

دوستان اگر راهنمایی کنید ممنون میشم
اینم کدهام



<%@ Page Language="C#" AutoEventWireup="true" CodeFile="menus.aspx.cs" Inherits="menus" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
body {
direction: rtl;
text-align: right;
}

#navigation {
font-size: 12px;
font-family: Tahoma;
width: 185px;
}

#navigation ul {
margin: 0px;
padding: 0px;
background-color: #FFFFFF;
}

#navigation li {
list-style: none;
border-top: #c0c0c0 solid;
border-right: #c0c0c0 solid;
border-left: #c0c0c0 solid;
border-width: 1px;
}

#navigation a {
color: #33cccc;
display: block; /*bad az link be satr bad miravad*/
height: 25px;
line-height: 25px;
text-indent: 10px; /*mizane to rafteghi*/
text-decoration: none;
width: 100%;
}

#navigation a:hover {
color: black;
}

#navigation li:hover {
background-color: #33cccc;
position: relative;
}
/*az inja sub level ha eyene ham faghat esm kelas fargh*/
ul.sub-level {
display: none;
}

#navigation li:hover .sub-level {
background-color: #fff;
border: #fff solid;
border-width: 1px;
display: block;
position: absolute;
right: 150px;
top: 5px;
}

ul.sub-level li {
border: none;
float: right;
width: 150px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div id="navigation">
<ul>
<li><a href="#">صفحه اصلی</a>
</li>
<li><a href="#">درباره شهر</a>
<ul class="sub-level">
<li><a href="#">منوی یک</a></li>
<li><a href="#">منوی دو</a></li>
<li><a href="#">منوی سه</a></li>
</ul>
</li>
<li><a href="#">درباره شهر</a></li>

<li><a href="#" style="border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: #c0c0c0">تماس با ما</a></li>
</ul>
</div>
</form>
</body>
</html>

elyas_delshadnbe
دوشنبه 02 تیر 1393, 12:03 عصر
همه معمولا تو positioning مشکل دارن
اینجا رو اصلاح کن



#navigation li:hover .sub-level{
background-color: #fff;
border: #fff solid;
border-width: 1px;
display: block;
position: absolute;
right: 183px;
top: -2px;
}