Измерения внешнего вида меню - Joomla 1.5: Вопросы по работе с меню

День добрый, я хочу изменить внешний вид меню в css нашел стили к этому меню, но проблема в том что если я задаю фон для тега <li> то он задается как на меню, так и на под меню (получается не красиво)
Я хотел задать стиль только для под меню, но для этого нужно найти в коде само меню, в index.php  прописано :
<jdoc:include type="modules" name="user4" style="xhtml" />
Но где найти-то само меню?

Модуль, который отвечает за меню находится в modules\mod_mainmenu файл вывода, по идее, modules\mod_mainmenu\tmpl\default.php
Надеюсь знающие меня поправят, если я не прав.
Возможно еще и в настройках самого меню можно что-то указать...

в css
ul li {background:картинка }
ul li ul li {background:none}

в css
ul li {background:картинка }
ul li ul li {background:none}

было бы все так просто я уже наслаждался красивым меню, но там же все так закручено что х разбереш

в css
ul li {background:картинка }
ul li ul li {background:none}

вот что у меня в файле css

/* LEFT COLUMN + RIGHT COLUMN
--------------------------------------------------------- */
#ja-col1 {
   float: left;
   width: 175px;
   overflow: hidden;
}

.wide #ja-col1 {
   width: 220px;
}

#ja-col1 div.innerpad {
   padding: 85px 7px 15px;
}

.wide #ja-col1 div.innerpad {
   padding: 85px 10px 15px; 
}

#ja-col2 {
   float: right;
   width: 24.9%;
   overflow: hidden;
   padding: 15px 0;
}

#ja-col2 div.innerpad {
   padding: 0 7px 0 0;
}

.wide #ja-col2 div.innerpad {
   padding: 0 15px 0 0;
}

#ja-col1 table,
#ja-col2 table {
   border-collapse: collapse;
   border-spacing: 0;
}

#ja-col1 ul li,
#ja-col2 ul li {
   padding-left: 10px;
   margin: 3px;
   background: url(../images/arrow.png) no-repeat 0 8px; /*--------------------------------------------*/
}

#ja-col1 ul,
#ja-col2 ul {
   margin: 3;
}


что мне изменит?

Добавить
#ja-col1 ul li ul li,
#ja-col2 ul li  ul li {
   padding-left: по вкусу;
   margin: по вкусу;
   background: none; /*--------------------------------------------*/
}

Добавить
#ja-col1 ul li ul li,
#ja-col2 ul li  ul li {
   padding-left: по вкусу;
   margin: по вкусу;
   background: none; /*--------------------------------------------*/
}

и что это изменит? только картинка пропадет а проблеиму не ришит

А что надо?

я прикрепил скрин меню

нужно что бы стиль пременялся только к подменю а не ко всему меню.
если я прописываю так
#ja-col1 ul li,
#ja-col2 ul li {
   padding-left: 10px;
   margin: 3px;
   background:#999999;

то этот стиль распространяется и на родительский пункт меню и на все дочернии, а нужно только что бы только на дочернии

[вложение удалено Администратором]

Думать надо, выше что написано!! И орфографию поправить

выше что написано!!

Где выше? поканичего по делу не посоветовали

Так тебе же выше и написали, вот дискриптор:

#ja-col2 ul li  ul li {}

Свойства - по вкусу.

Так тебе же выше и написали, вот дискриптор:

#ja-col2 ul li  ul li {}

Свойства - по вкусу.

Вы издеваетесь? ))
вопрос в том и стоит какие свойства задать что бы стиль распространялся только на под меню

Если не ошибаюсь - у меня тот же вопрос: как настроить стиль отдельно для под меню.

На сайте http://minipig.ee если нажать на "Наши свинки" или "Поросята" - выпадает по 2 пункта, как для них отдельно стиль прописать?
В template.css для основных ссылок меню прописано это:

.right a {
       vertical-align: middle;
       text-align: center;
       text-decoration : none;
       font-family: Verdana;
       font-size: 15px;
       color: #000000;
       font-weight:bold;
}


.right a:hover {
   color : #333;
   text-decoration : none;
        border-bottom:1px solid black;
        border-top:1px solid black;
        border-left:1px solid black;
        border-right:1px solid black;
}

5py0n, попробуй так
div#active_menu div {
/*а вот тут рисовать свойства */
}
Вообще мне очень помогла информация с сайта http://htmlbook.ru(не сочтите за рекламу), там в разделе шаг за шагом очень доступно описано как работать с css.

Упс, не правильно на теги посмотрел. Так не сработает
Не могу свое сообщение удалить. Модераторы, пожалуйста, удалите?

fate, юноша, вам уже несколько раз указали, как для меню и для подменю задать отдельные стили:

в css
ul li {background:картинка }
ul li ul li {background:none}

Где какой стиль прописывать - дело ваше, но в любом случае:
ul li
{
здесь задается стиль для пунктов меню
}
ul li ul li
{
здесь - подменю
}
ul li ul li ul li
{
здесь - подменю второго уровня
}

и так далее.

5py0n
Эти ссылки у вас имеют класс .sublevel
Значит в css:
.sublevel
{
здесь настройки
}

Советую установить плагин firebug для браузера firefox - он показывает, какие классы и свойства приписаны тому или иному объекту на странице. Очень удобно.

chtec

Про sublevel я додумался, не помогает это, нету изменений..

ul li
{
здесь задается стиль для пунктов меню
}
ul li ul li
{
здесь - подменю
}
ul li ul li ul li
{
здесь - подменю второго уровня
}

и так далее.

Спасибо тебе друг ))все работает )

fate, юноша, вам уже несколько раз указали, как для меню и для подменю задать отдельные стили:

а можно сделать фон ячейки в виде градиента? если я создаю картинку, а потом прописываю background: url
она у меня на фоне как-то скошено получается ((

Про sublevel я додумался, не помогает это, нету изменений..

.sublevel это класс тега <a>, соответственно, вариантов изменения стилей под него не так уж и много - то, что относится к шрифтам. 5py0n а что конкретно ты хочешь там изменить? Фон?

fate, можно залить ячейку картинкой. Что значит скошено? Если градиент у тебя с прозрачностью, то возникнет баг в IE.

.sublevel это класс тега <a>, соответственно, вариантов изменения стилей под него не так уж и много - то, что относится к шрифтам. 5py0n а что конкретно ты хочешь там изменить? Фон?

Я просто хотел уменьшить размер шрифа подменю.

посмотрите во вложении

[вложение удалено Администратором]

5py0n, как я понял, ты пытался задать размер шрифта в 12px?
Судя по тому, что я вижу в FireBug свойства заданные для класса .submenu отменяются вот этими
template.css (line 311)
.right a {
color:#000000;
font-family:Verdana;
font-size:15px;
font-weight:bold;
text-align:center;
text-decoration:none;
vertical-align:middle;

fate, если я правильно понял, то тебе не нравится то, что картинка начинается не с самого верха ячейки?
А сам градиент задумывался из серого тона справа в белый слева? Я бы лично сделал в высоту градиент 1 пиксель, а в ширину столько, сколько нужно для этого меню, и в css проставил background-position: top; и background-repeat: repeat-x;
Т.е. выравнивание картинки по верхней границе, и повторение картинки по оси х(по вертикали).
ИМХО должно сработать.

5py0n, просто поставь для нужных параметров !important
т.е.
.submenu {
font-size: 12px !important;
}
и будет гуд.

fate, если я правильно понял, то тебе не нравится то, что картинка начинается не с самого верха ячейки?
А сам градиент задумывался из серого тона справа в белый слева? Я бы лично сделал в высоту градиент 1 пиксель, а в ширину столько, сколько нужно для этого меню, и в css проставил background-position: top; и background-repeat: repeat-x;
Т.е. выравнивание картинки по верхней границе, и повторение картинки по оси х(по вертикали).
ИМХО должно сработать.

Спасибо огроменное, все работает, только не по x а по y

master_alf

Спасибо за подсказку. Убрал вообще .right a и .right a:hover, дописал .mainlevel, .mainlevel:hover и .sublevel, .sublevel:hover - теперь все работает =)