2х уровневое меню с радиусами

Для себя:
Приводиться только код.

.top_menu { position: relative; z-index:999;}
.top_menu  ul{ list-style: none; padding:0px; background:url("../images/top_menu.png") repeat-x ; 
height: 42px;
border-top:1px solid #e4e4e4;
border-right:1px solid #e4e4e4;
border-bottom:1px solid #e4e4e4;
border-left:1px solid #e4e4e4;
border-top-left-radius:3px 3px;
-moz-border-radius-topleft:3px 3px;
-webkit-border-top-left-radius:3px 3px;
border-top-right-radius:3px 3px;
-moz-border-radius-topright:3px 3px;
-webkit-border-top-right-radius:3px 3px;
border-bottom-left-radius:3px 2px;
-moz-border-radius-bottomleft:3px 2px;
-webkit-border-bottom-left-radius:3px 2px;
border-bottom-right-radius:3px 3px;
-moz-border-radius-bottomright:3px 3px;
-webkit-border-bottom-right-radius:3px 3px;





 }
.top_menu  li{ display: block; float: left; padding-left: 23px; padding-right: 23px; border-left: 1px solid #e7e7e7; height: 39px; padding-top: 10px; }
.top_menu  ul li a { font-size: 14px; text-transform: uppercase; text-decoration: none; color:#58595b; font-family: Arial;  }
.top_menu  ul li a:hover { color:#003bad;  }
.top_menu  li:hover { background:url("../images/top_menu_act.png") repeat-x; cursor: pointer; }
.top_menu  li.active { background:url("../images/top_menu_act.png") repeat-x;}
.top_menu  li:hover a {color:#003bad;}

.top_menu ul li ul { display: none; background: #e1e1e1; height: auto; width: auto; max-width: 250px; top:40px; margin-left: -23px; border: 1px solid #cccccc; padding-bottom: 10px;}
.top_menu  li:hover ul { display: block; position: absolute; }
.top_menu ul li ul li {display: block; width:180px; float: none; height: auto; padding-left: 10px; padding-right: 10px; }
.top_menu ul li ul li a{font-size: 12px; font-family: Arial; text-transform: none; color:#58595b; }
.top_menu ul li ul li:hover { background: none; } 
.top_menu ul li ul li:hover { background: none; } 
.top_menu  ul li ul li.active {background: none;}
.top_menu  ul li ul li.active a {color:#003bad !important;  }
.top_menu ul li:hover ul li a{ color:#58595b; }
.top_menu ul li:hover ul li a:hover{ color:#003bad; }

Отправить комментарий