[X] Помощник

[southklad Topic Starter]

Подскажите пожалуйста , есть меню , переделал его под всплывающее , но оно отображается не корректно , а точнее выплывает подменю не в низ в влево под следующих столбик , а 2 подменю вообще сбоку страницы , почему не пойму , вот код css

/*

*/
body {
margin: 0px;
padding: 0px;
color: #6c6969;
font-family: Tahoma, Geneva, sans-serif;
font-size: 12px;
line-height: 1.5em;
background-color: #252423;
background-image: url(images/templatemo_body.jpg);
background-repeat: repeat-x;
background-position: top
}
a, a:link, a:visited {
color: #990000;
}
a:hover {
color: #AAAA00;
text-decoration: none;
}
a.more { display: block; width: 137px; height: 35px; background: url(images/templatemo_read_more.png) no-repeat }
p { margin: 0 0 10px 0; padding: 0; }
img { border: none; }
h1, h2, h3, h4, h5, h6 { color: #252525; font-weight: normal }
h1 { font-size: 34px; margin: 0 0 30px 0; padding: 5px;  }
h2 { font-size: 24px; margin: 0 0 30px 0; padding: 5px 0 5px 35px; background: url(images/h2.png) no-repeat top left }
h3 { font-size: 21px; margin: 0 0 15px; padding: 0; }
h4 { font-size: 18px; margin: 0 0 15px; padding: 0; }
h5 { font-size: 16px; margin: 0 0 10px; padding: 0; color: #9d764b; }
h6 { font-size: 14px; margin: 0 0 5px; padding: 0; }
.clear { clear: both }
.h10 { height: 10px }
.h20 { height: 20px }
.h30 { height: 30px }
.h40 { height: 40px }
.h50 { height: 50px }
.h60 { height: 60px }
.templatemo_cleaner { height: 0px; clear: both; }
.float_l { float: left }
.float_r { float: right }
.image_wrapper { display: inline-block; border: 5px solid #a08464; margin-bottom: 10px }
.image_fl { float: left; margin: 3px 30px 0 0 }
.image_fr { float: right; margin: 3px 0 0 30px }f
blockquote { font-style: italic; margin-left: 10px}
cite { font-weight: bold; color:#ccc }
cite span { color: #ccc }
em { color: #fff; font-weight: 400 }
.tmo_list { margin: 0 0 0 20px; padding: 0; list-style: none }
.tmo_list li { color:#9c7449; margin:0 0 5px; padding: 3px 0 3px 15px; background:url(images/templatemo_list.png) no-repeat scroll 0 10px }
.tmo_list li a { color: #9c7449; text-decoration: underline }
.tmo_list li a:hover { color: #AAAA00 }
.tmo_list li.col_3 { display: block; float: left; width: 170px; }

#templatemo_wrapper_01 { width: 100%; background: url(images/templatemo_header.jpg) no-repeat center top }
#templatemo_wrapper_02 { width: 1000px; margin: 0 auto }
#templatemo_header { width: 980px; height: 160px; padding: 0 20px; margin-bottom: 10px; background: url(images/templatemo_header.jpg) no-repeat center top }
#site_title a {
float: left;
display: inline-block;
width: 270px;
padding: 55px 0 0 0;
margin-top: 40px;
font-size: 14px;
color: #e9bb7b;
font-weight: 400;
text-align: right;
text-decoration: none;
background: url(images/templatemo_logo.png) no-repeat top left
}
#header_right {
float: right;
width: 600px;
text-align: right;
padding-top: 30px;
}
#header_right a.button { display: inline-block; }
#header_right a.twitter { width: 58px; height: 56px; margin-right: 20px; background: url(images/twitter.png) no-repeat }
#header_right a.mail { width: 61px; height: 38px; margin-right: 20px; padding-bottom: 5px; background: url(images/mail.png) no-repeat }
#header_right a.rss { width: 51px; height: 54px; margin-right: 20px; background: url(images/rss.png) no-repeat }
#search_box { float:right; width: 252px; height: 37px; margin: 10px 0 0 0; background: url(images/templatemo_search_box.png) no-repeat; text-align: left }
#search_box form { clear: both; width: 252px; height: 37px; padding: 0; }
#searchfield { width: 160px; height: 25px; padding: 5px; color: #fff; background: none; border: none; }
#searchbutton { width: 75px; height: 30px; padding: 0 0 5px 0; margin: 0; cursor: pointer; background: none; border: none; }
/* menu */
#templatemo_menu
{
clear: both;
padding: 0;
margin-top: 10px;
}
#templatemo_menu ul {
float: right;
display: inline-block;
margin: 0;
padding: 0;
list-style: none;
}
#templatemo_menu ul li {
padding: 0;
margin: 0;
display: inline;
}
#templatemo_menu ul li a {
float: left;
padding: 0 10px;
font-size: 12px;
color: #e9bb7b;
text-align: center;
font-weight: 700;
text-decoration: none;
background: url(images/templatemo_menu_divider.jpg) center right no-repeat;
border-right: 2px solid #e9bb7b;
}
#templatemo_menu ul li a:hover, #templatemo_menu ul .current {
color: #ffdfb2;
}
#templatemo_menu ul .last { border: none; padding-right: 0 }
/* end of menu */
#templatemo_main {
width: 1000px;
}
#templatemo_content_wrapper { float: left; width: 660px; background: url(images/templatemo_content.jpg) repeat-y; }
#templatemo_content_top { width: 660px; height: 90px; background: url(images/templatemo_content_top.jpg) no-repeat }
#templatemo_content_bottom { clear: both; width: 660px; height: 135px; background: url(images/templatemo_content_bottom.jpg) no-repeat }
#templatemo_content { padding: 0 30px }
.content_box { clear: both; margin-bottom: 60px }
.col_w250 { width: 250px }
.last_box { margin: 0 }
#templatemo_sidebar {
float: right;
width: 280px;
}
#templatemo_sidebar .tmo_list { font-size: 14px; margin: 0; padding: 0 }
#templatemo_sidebar .tmo_list li a { text-decoration: none }
.sidebar_box_wrapper {
border: 1px solid #52493f;
background: #1b1a19;
}
.templatemo_sidebar_bottom {
clear: both;
width: 280px;
height: 30px;
margin: 20px 0px 20px 0px;
background: url(images/divider.png) no-repeat center top;
}
.sidebar_box { clear: both; border-bottom: 1px solid #52493f }
.sidebar_box .sb_title {
width: 218px;
height: 30px;
padding: 15px 30px;
border-bottom: 1px solid #52493f;
background: url(images/templatemo_sidebar_title.jpg) top center no-repeat;
}
.sidebar_box .sb_content { padding: 30px }
a.ads_125 {
display: block;
float: left;
width: 125px;
height: 125px;
margin: 0 0 10px 10px;
}
a.ads_125 img { width: 125px; height: 125px; }
.last_box { margin: 0 }
#templatemo_footer {
clear: both;
width: 980px;
padding: 20px;
text-align: left;
color: #e1cfb5;
}
#nav {
     float: left;
    font: bold 12px Arial, Helvetica, Sans-serif;
     border: 1px solid #121314;
     border-top: 1px solid #2b2e30;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     overflow: hidden;
}
#nav ul {
margin:0;
padding:0;
list-style:none;
}
#nav ul li {
float:left;
}
#nav ul li a {
    float: left;
color:#d4d4d4;
     padding: 10px 8px;
text-decoration:none;
     background:#3C4042;
  background: -webkit-gradient( linear, left bottom, left top, color-stop(0.09, rgb(59,63,65)), color-stop(0.55, rgb(72,76,77)), color-stop(0.78, rgb(75,77,77)) );
background: -moz-linear-gradient( center bottom, rgb(59,63,65) 9%, rgb(72,76,77) 55%, rgb(75,77,77) 78% );
background: -o-linear-gradient( center bottom, rgb(59,63,65) 9%, rgb(72,76,77) 55%, rgb(75,77,77) 78% );
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset, 0 0 5px rgba(0, 0, 0, 0.1) inset;
border-left: 1px solid rgba(255, 255, 255, 0.05);
        border-right: 1px solid rgba(0,0,0,0.2);
  text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.6);
}
#nav ul li a:hover,
#nav ul li:hover > a {
     color: #252525;
     background:#3C4042;
background: -webkit-gradient( linear, left bottom, left top, color-stop(0.09, rgb(77,79,79)), color-stop(0.55, rgb(67,70,71)), color-stop(0.78, rgb(69,70,71)) );
background: -moz-linear-gradient( center bottom, rgb(77,79,79) 9%, rgb(67,70,71) 55%, rgb(69,70,71) 78% );
background: -o-linear-gradient( center bottom, rgb(77,79,79) 9%, rgb(67,70,71) 55%, rgb(69,70,71) 78% );
     text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2), 0 -1px #000;
}
#nav li ul a:hover,
#nav ul li li:hover > a  {
    color: #2c2c2c;
   background: #5C9ACD;
background: -webkit-gradient( linear, left bottom, left top, color-stop(0.17, rgb(61,111,177)), color-stop(0.51, rgb(80,136,199)), color-stop(1, rgb(92,154,205)) );
background: -moz-linear-gradient( center bottom, rgb(61,111,177) 17%, rgb(80,136,199) 51%, rgb(92,154,205) 100% );
background: -o-linear-gradient( center bottom, rgb(61,111,177) 17%, rgb(80,136,199) 51%, rgb(92,154,205) 100% );
     border-bottom: 1px solid rgba(0,0,0,0.6);
     border-top: 1px solid #7BAED9;
     text-shadow: 0 1px rgba(255, 255, 255, 0.3);
}

#nav li ul {
     background:#3C4042;
     background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.09, rgb(77,79,79)), color-stop(0.55, rgb(67,70,71)), color-stop(0.78, rgb(69,70,71)) );
     background-image: -moz-linear-gradient( center bottom, rgb(77,79,79) 9%, rgb(67,70,71) 55%, rgb(69,70,71) 78% );
     background-image: -o-linear-gradient( center bottom, rgb(77,79,79) 9%, rgb(67,70,71) 55%, rgb(69,70,71) 78% );
     border-radius: 0 0 10px 10px;
     -moz-border-radius: 0 0 10px 10px;
     -webkit-border-radius: 0 0 10px 10px;
     left: -999em;
     margin: 35px 0 0;
     position: absolute;
     width: 160px;
     z-index: 9999;
     box-shadow: 0 0 15px rgba(0, 0, 0, 0.4) inset;
     -moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.4) inset;
     -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.4) inset;
     border: 1px solid rgba(0, 0, 0, 0.5);
}
#nav li:hover ul {
     left: auto;
}
#nav li ul a {
     background: none;
     border: 0 none;
     margin-right: 0;
     width: 120px;
     box-shadow: none;
     -moz-box-shadow: none;
     -webkit-box-shadow: none;
     border-bottom: 1px solid transparent;
     border-top: 1px solid transparent;
}
#nav li li ul {
     margin: -1px 0 0 160px;
     -webkit-border-radius: 0 10px 10px 10px;
     -moz-border-radius: 0 10px 10px 10px;
     border-radius: 0 10px 10px 10px;
     visibility:hidden;
}
#nav li li:hover > ul {
        opacity:1;
     visibility:visible;
}
#nav ul ul li:last-child > a {
-moz-border-radius:0 0 10px 10px;
-webkit-border-radius:0 0 10px 10px;
border-radius:0 0 10px 10px;
}
#nav ul ul ul li:first-child > a {
-moz-border-radius:0 10px 0 0;
-webkit-border-radius:0 10px 0 0;
border-radius:0 10px 0 0;
}

Думаю где то конфликт , но не пойму где ???

[southklad Topic Starter]

с этим разобрался

Замечание модератора: Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней. Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой или обратитесь к любому из модераторов.