Нужна помощь с меню в ша...

[Maijin]

Здравствуйте! помогите разобратся с меню в шаблоне VT metro _http://vtem.net/demo/?template=vt_metro

Дело в том что пункты выпадающего меню там сделаны фиксированного размера, и если название пункта меню больше размера ячейки, то текст, который выходит за рамки ячейки, становится не видимым. как сделать так, чтобы ячейки увеличивались в высоту, в зависимости от текста?

---------- Сообщение добавлено 13:14 ---------- Предыдущее 11:45 ----------

вот стили для меню

Развернуть текст

/* level 1 or Top Level*/
.menu ,#tienda_categories_mod,#vt_menu_footer ul, ul.VMmenu, ul.weblinks, .mostread{
text-align: left;
list-style: none;
padding:0;
margin:0;
}
.mostread li a:hover{ text-decoration:underline;}
ul.menu li.current.active.parent ul,
ul.menu li.active.parent ul{
background:url(../images/line_content.png) repeat-x left top;
}

.menu a,.menu a:link,.menu a:visited, .mostread li a,
.weblinks a,.weblinks a:link,.weblinks a:visited,
#tienda_categories_mod a,#tienda_categories_mod a:link,#tienda_categories_mod a:visited,
div.moduletable a.mainlevel, ul.VMmenu li a,
div.moduletable a.mainlevel{
font-size:110%;
color:#666;
display: block;
text-decoration:none;
padding:5px 8px 5px 15px;
background:url(../images/arrow.png) left center no-repeat !important;
margin:0;
}
#current ul li a, .current ul li a span{
color:#999;
display: block;
background-position:left center;
}
/* end of Level 1 */
/* Level 2 Grey */
.menu ul {
list-style: none;
padding: 0px;
}
.menu ul li a,.menu ul li a:link,.menu ul li a:visited, #current ul li a{
color:#999;
display: block;
background-position: left center;
background-color:transparent;
}
#current ul li a:hover{ text-decoration:none !important;}
/* End of Level 2 */
/* BEGIN MAIN MENU */
.menu_vtem_nav{ z-index:1001 !important;}
#vtem_menu ul.menu_vtem_nav{
background:none;
list-style:none;
height:100px;
}
#vtem_menu ul.menu_vtem_nav ul{font-weight:normal;}
#vtem_menu ul.menu_vtem_nav li a,
#vtem_menu ul.menu_vtem_nav li a:link,
#vtem_menu ul.menu_vtem_nav li a:visited{
text-decoration:none;
display:block;
cursorointer;
margin:0px;
padding:0px 0px 15px;
transition:all 0.5s ease 0.1s;
-moz-transition:all 0.5s ease 0.1s;
-webkit-transition:all 0.5s ease 0.1s;
height:0px;
text-align:center;
line-height:normal;
color:#888;
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
_float:left;
}

#vtem_menu ul.menu_vtem_nav li ul li a{ font-size:12px !important;}
#vtem_menu ul.menu_vtem_dropline li a,
#vtem_menu ul.menu_vtem_dropline li a:link,
#vtem_menu ul.menu_vtem_dropline li a:visited{
padding:25px 5px 24px 20px;
font-weight:bold;
text-transform:none;
font-size:12px;
color:#ccc;
display:block;
}
#vtem_menu ul.menu_vtem_dropline li ul li a,
#vtem_menu ul.menu_vtem_dropline li ul li a:link,
#vtem_menu ul.menu_vtem_dropline li ul li a:visited{
padding:5px 5px 5px 5px;
font-weight:normal;
text-transform:none;
font-size:11px;
display:block;
}
#vtem_menu ul li a span {
display:block;
padding:0px 30px 0px;
margin:20px 0px 0px;
_float:left;
}

#vtem_menu ul li a span.image-title{padding:5px 0px; margin:0; border:0px;}

.vtem_menu_plus{
width:14px;
height:8px;
border:0px !important;
border-radius:0px !important;
-webkit-border-radius:0px !important;
-moz-border-radius:0px !important;
padding:0px !important;
margin:0px !important;
top:33px !important;
left:20% !important;
display:none !important;
background:url(../images/vtem_ul_arrow_style.png) no-repeat !important;
}
#vtem_menu ul ul li a span,
#vtem_menu ul ul ul li a span,
#vtem_menu ul ul ul ul li a span{ margin:0px; line-height:33px; border:0px;}
#vtem_menu ul li ul li a span { padding:0px 20px 0px 0px;}
#vtem_menu ul.menu_vtem_dropline li ul li a span {
display: block;
padding: 0px 5px 0px 0px;
}
#vtem_menu ul.menu_vtem_nav li a.hover,
#vtem_menu ul.menu_vtem_nav li a:hover,
#vtem_menu ul.menu_vtem_nav li.active a,
#vtem_menu ul.menu_vtem_nav li.current a,
#vtem_menu ul.menu_vtem_nav li.active a{
text-decoration:none;
padding:0px 0px 50px;
height:50px;
background:url(../images/bg_metro_menu.jpg) 0 0 no-repeat;
}

#vtem_menu ul.menu_vtem_nav li a.hover span,
#vtem_menu ul.menu_vtem_nav li a:hover span,
#vtem_menu ul.menu_vtem_nav li.active a span,
#vtem_menu ul.menu_vtem_nav li.current a span,
#vtem_menu ul.menu_vtem_nav li.active a span{ border:0px;}

#vtem_menu ul.menu_vtem_nav li.parent ul li a,
#vtem_menu ul.menu_vtem_nav li ul li.active ul li a,
#vtem_menu ul.menu_vtem_nav li ul li.active ul li a span,
#vtem_menu ul.menu_vtem_nav li.parent ul li.current ul li a,
#vtem_menu ul.menu_vtem_nav li.parent ul li ul li.current a,
#vtem_menu ul.menu_vtem_nav li ul li.active.parent ul li a,
#vtem_menu ul.menu_vtem_nav li ul li.current.active ul li a,
#vtem_menu ul.menu_vtem_nav li ul li.current a,
#vtem_menu ul.menu_vtem_nav ul li ul li.current a,
#vtem_menu ul.menu_vtem_nav li.active ul li a,
#vtem_menu ul.menu_vtem_nav li.active.parent ul li a,
#vtem_menu ul.menu_vtem_nav li.parent ul li.current ul li a span{background-color:#333 !important; color:#999; }

#vtem_menu ul.menu_vtem_nav li.vtemHover ul li a:hover,
#vtem_menu ul.menu_vtem_nav li.parent ul li a:hover,
#vtem_menu ul.menu_vtem_nav li.vtemHover ul li.current a,
#vtem_menu ul.menu_vtem_nav li.parent ul li.current a,
#vtem_menu ul.menu_vtem_nav li.vtemHover ul li.current a:hover,
#vtem_menu ul.menu_vtem_nav li.parent ul li.current a:hover{color:#999; }
#vtem_menu ul.menu_vtem_nav li.parent ul li a span{background:none; color:#999;}
#vtem_menu ul.menu_vtem_nav li.parent ul li a:hover span,
#vtem_menu ul.menu_vtem_nav li.parent ul li.current a span,
#vtem_menu ul.menu_vtem_nav li.parent ul li.current a:hover span{background:none; color:#fff;}
#vtem_menu ul.menu_vtem_nav li ul li.active a,
#vtem_menu ul.menu_vtem_nav li ul li.active a span,
#vtem_menu ul.menu_vtem_nav li ul li a.hover span,
#vtem_menu ul.menu_vtem_nav li ul li.active a.hover span{ color:#fff;}
#vtem_menu ul.menu_vtem_dropline li a:hover,
#vtem_menu ul.menu_vtem_dropline li a:hover span,
#vtem_menu ul.menu_vtem_dropline li.vtemHover ul li a:hover,
#vtem_menu ul.menu_vtem_dropline li.parent ul li.current a,
#vtem_menu ul.menu_vtem_dropline li.parent ul li.active a,
#vtem_menu ul.menu_vtem_dropline li:hover ul{
background:#333;
transition:all 0.5s ease 0.1s;
-moz-transition:all 0.5s ease 0.1s;
-webkit-transition:all 0.5s ease 0.1s;
text-decoration:none;
color:#fff;
}
#vtem_menu ul.menu_vtem_nav li.vtemHover ul,
#vtem_menu ul.menu_vtem_nav li.sfHover ul,
#vtem_menu ul.menu_vtem_nav li.parent ul{
top:100px;
width:220px;
padding:8px;
}
.menu_vtem_nav ul ul{ background:#333;}
#vtem_menu ul.menu_vtem_nav li.parent ul li ul,
#vtem_menu ul.menu_vtem_nav li.parent ul li ul li ul{ top:0px;}
#vtem_menu ul.menu_vtem_dropline li.parent ul{top:63px;}
#vtem_menu ul.menu_vtem_nav ul li{
padding:0px 0px 2px !important;
margin:0px;
display:block;
width:100%;
background:url(../images/line_menu.jpg) left bottom repeat-x;
}

#vtem_menu ul.menu_vtem_dropline li ul li.active a span{ text-decoration:underline;}
#vtem_menu ul.menu_vtem_nav ul li a,
#vtem_menu ul.menu_vtem_nav ul li a:link,
#vtem_menu ul.menu_vtem_nav ul li a:visited,
#vtem_menu ul.menu_vtem_nav ul li.current ul li a,
#vtem_menu ul.menu_vtem_nav ul li.active a,
#vtem_menu ul.menu_vtem_nav li ul li.active ul li a{
padding:0px 0px 0px 20px;
margin:0px;
text-transform:none;
font-weight:normal;
background-image:url(../images/li_arrow1.gif) !important;
background-repeat:no-repeat;
background-position:5px center !important;
text-align:left;
}
#vtem_menu ul.menu_vtem_nav ul li a:hover,
#vtem_menu ul.menu_vtem_nav ul li a.hover:hover,
#vtem_menu ul.menu_vtem_nav ul li.active a.ahover,
#vtem_menu ul.menu_vtem_nav ul li.current a,
#vtem_menu ul.menu_vtem_nav ul li.current a:hover,
#vtem_menu ul.menu_vtem_nav ul li a.hover,
#vtem_menu ul.menu_vtem_nav li ul li.active a,
#vtem_menu ul.menu_vtem_nav ul li ul li.current a,
#vtem_menu ul.menu_vtem_nav li.parent ul li ul li.current a{background-image:url(../images/li_arrow11.gif) !important; }
#vtem_menu ul.menu_vtem_nav li.parent ul li a{padding-left:20px !important;}
#vtem_menu ul.menu_vtem_nav li.current ul li a{padding-left:20px !important;}
.menu_vtem_nav ul li.vtem_ul_arrow{ display:none !important; border:0px !important;}
/* END MAIN MENU */

[свернуть]

[xilgiz]

Так Вам никто не ответит. Надо посмотреть на сайт..

Кстати, в высоту или ширину?

[Павел Joofaq]

Вот в этом файле: /vt_metro/templates/vt_metro/css/navigation.css

Строка ~ 198, width: 220px; - меняете ширину на нужное значение.

[Maijin]

Павел Joofaq, это я нашел. Вопрос в том как сделать чтобы ячейки меняли высоту в зависимости от текста.
т.е. если текст опции в ширину меню влезает (в ширину которую вы говорите поменять) то все ок, а если нет то ячейка увеличивается в высоту.

[londer]

Всем привет.
Надеюсь вопрос еще актуален.
Как я понял шаблон по этому адресу расположен - http://vtem.net/demo/?template=vt_metro
Сделал так.. Добавил к navigation.css на 242 строку (#vtem_menu ul.menu_vtem_nav li.parent ul li a) значение..height:auto!important
Все получилось, на скрине всё думаю понятней расписано..Редактировал через хром..