#container
{width:760; height: 800;margin-left:10%;}
#content
{width: 760; height: 800}
#header
{ width: 760; height: 200}
#meno
{width: 760; height: 150;margin-left:35px}
/* Begin CSS Drop Down Menu */
#menuh
{
font-size: small;
font-family: arial, helvetica, sans-serif;
width:100%;
float:left;
margin:2em;
margin-top: 1em;
}
#menuh a
{
text-align: center;
display:block;
border: 1px solid #555;
white-space:nowrap;
margin:0;
padding: 0.3em;
}
#menuh a:link, #menuh a:visited, #menuh a:active
{
color: white;
background-color: royalblue;
text-decoration:none;
}
#menuh a:hover
{
color: white;
background-color: cornflowerblue;
text-decoration:none;
}
#menuh a.top_parent, #menuh a:hover.top_parent
{
background-image: url(navdown_white.gif);
background-position: right center;
background-repeat: no-repeat;
}
#menuh a.parent, #menuh a:hover.parent
{
background-image: url(nav_white.gif);
background-position: right center;
background-repeat: no-repeat;
}
#menuh ul
{
list-style:none;
margin:0;
padding:0;
float:left;
width:9em; /* width of all menu boxes */
/* NOTE: For adjustable menu boxes you can comment out the above width rule.
However, you will have to add padding in the "#menh a" rule so that the menu boxes
will have space on either side of the text -- try it */
}
#menuh li
{
position:relative;
min-height: 1px; /* Sophie Dennis contribution for IE7 */
vertical-align: bottom; /* Sophie Dennis contribution for IE7 */
}
#menuh ul ul
{
position:absolute;
z-index:500;
top:auto;
display:none;
padding: 1em;
margin:-1em 0 0 -1em;
}
#menuh ul ul ul
{
top:0;
left:100%;
}
div#menuh li:hover
{
cursor:pointer;
z-index:100;
}
div#menuh li:hover ul ul,
div#menuh li li:hover ul ul,
div#menuh li li li:hover ul ul,
div#menuh li li li li:hover ul ul
{display:none;}
div#menuh li:hover ul,
div#menuh li li:hover ul,
div#menuh li li li:hover ul,
div#menuh li li li li:hover ul
{display:block;}
/* End CSS Drop Down Menu *
<body>
<div id=container>
<div id=content>
<div id=header><img src=images/24.jpg></div>
<div id=meno>
<div id="menuh" style="width: 724px; height: 14px">
<ul>
<li><a href="#" class="top_parent">اموزش</a>
<ul>
<li><a href="#">درباره ما</a></li>
<li><a href="#" class="parent">دوره های اموزشی</a>
<ul>
<li><a href="#">ICDL</a></li>
<li><a href="#">FRONT PAGE</a></li>
<li><a href="#">AUTO CAD</a></li>
<li><a href="#">PHOTOSHOP</a></li>
</ul>
</li>
<li><a href="#">کارگاه اموزشی</a></li>
<li><a href="#" class="parent">همکاری با سازمانها</a>
<ul>
<li><a href="#">بنیاد ICDL</a></li>
<li><a href="#">انیستیتو ایز ایران</a></li>
<li><a href="#">فنی و حرفه ای</a></li>
<li><a href="#">کار و امور اجتماعی</a></li>
</ul>
</li>
<li><a href="#" class="parent">دپارتمانها</a>
<ul>
<li><a href="#">مهندسی</a></li>
<li><a href="#">نرم افزار</a></li>
<li><a href="#">ICTکودکان</a></li>
<li><a href="#">PHOTOSHOP</a></li>
<li><a href="#">AUTO CAD</a></li>
</ul>
</li>
</ul>
</li>
</ul>
<ul>
<li><a href="#" >سرگرمی</a>
<ul>
<li><a href="#">کودکان</a></li>
<li><a href="#">بازی کامپیوتری</a>
<ul>
<li><a href="#">cd</a></li>
<li><a href="#">dvd</a></li>
</ul>
</li>
</ul>
</ul>
<ul>
<li><a href="#">تماس با ما</a>
<ul>
<li><a href="#">ادرس ایمیل</a></li>
<li><a href="#">ادرس وب سایت</a></li>
</ul>
</li>
</ul>
<ul>
<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>
</ul>
</li>
</ul>
<ul>
<li><a href="#">صفحه اصلی</a></li>
</ul>
</div> <!-- end the menuh-container div -->
</div> <!-- end the menuh div -->
</div>
</div>
</div>
</div>
</body>
</html>
