Проблема с субменю в шаблоне Versatility IV

Discussion in 'Внешний вид, шаблоны, графика' started by Dervish, Feb 9, 2011.

Page 1 of 2
  1. Offline

    Dervish Недавно здесь

    Joined:
    Feb 9, 2011
    Messages:
    17
    Likes Received:
    0
    Gender:
    Male
    Друзья, помогите с шаблоном Versatility IV. включен стиль moomenu для верхнего меню. но некоторые пункты в субменю состоят из нескольких слов. изначально длинные пукнты просто резались на 177 пикселях (ограничение в шаблоне). увеличил аж до 330 px, но не очень красиво - хочется, чтобы длинные пункты субменю просто отображало в 2 сточки с переносом слов. перерыл все что можно, но как сделать - не нашел :(. в веб-программировании не силен, вся надежда на вас.
     
    Dervish, Feb 9, 2011
    #1

  2. Ads Master

     
  3. OlegK
    Offline

    OlegK Russian Joomla! Team Staff Member ⇒ Профи ⇐

    Joined:
    Jan 17, 2011
    Messages:
    7,812
    Likes Received:
    771
    Gender:
    Male
    перевод строки "<br>"
     
    OlegK, Feb 9, 2011
    #2
    Dervish likes this.
  4. Offline

    Dervish Недавно здесь

    Joined:
    Feb 9, 2011
    Messages:
    17
    Likes Received:
    0
    Gender:
    Male
    да пробовал я его ставить, начитавшись один из топиков форумов буржуазных :). ставил в менеджере меню, при создании пункта меню в его имени в середине. так вот это имя у меня так и отображалось в меню с тегом посередке (((. куда ж его вставить?
    еще видел советы ставить pre-wrap в css, только вот к каком именно и где - ничего методом тыка не получилось (
     
    Last edited: Feb 10, 2011
    Dervish, Feb 10, 2011
    #3
  5. OlegK
    Offline

    OlegK Russian Joomla! Team Staff Member ⇒ Профи ⇐

    Joined:
    Jan 17, 2011
    Messages:
    7,812
    Likes Received:
    771
    Gender:
    Male
    смотри в firebug-инспектировать элемент,и выложи код css moomenu
     
    OlegK, Feb 10, 2011
    #4
  6. Offline

    Dervish Недавно здесь

    Joined:
    Feb 9, 2011
    Messages:
    17
    Likes Received:
    0
    Gender:
    Male
    Код (CODE):
    1. /**
    2.  * @version     1.5.4 August 20, 2010
    3.  * @author      RocketTheme, LLC http://www.rockettheme.com
    4.  * @copyright   Copyright (C) 2007 - 2010 RocketTheme, LLC
    5.  * @license     http://www.rockettheme.com/legal/license.php RocketTheme Proprietary Use License
    6.  */
    7. .menutop,.menutop *{margin:0;padding:0;}
    8. #horiznav{position:relative;z-index:1000;}
    9. #horiz-menu{z-index:50;}
    10. #horiz-menu li li{margin:0;}
    11. .menutop{line-height:1.0;float:left;margin-bottom:1.5em;position:relative;}
    12. .menutop ul{background:#fff;/*IE6 needs this*/
    13. padding:0;}
    14. .menutop li{float:left;list-style:none;position:relative;}
    15. #horiz-menu li li a, #horiz-menu li.active li a, #horiz-menu li li .separator, #horiz-menu li.active li .separator {display:block;padding:0;margin:0;text-decoration:none;float:none;height:30px;line-height: 32px;text-indent:8px;width:98%;}
    16. .menutop li ul{float:none;left:-999em;position:absolute;width:177px;z-index:500;}
    17. .menutop li:hover ul, .menutop li.sfHover ul{left:0;top:42px;}
    18. .menutop li:hover li ul, .menutop li.sfHover li ul, .menutop li li:hover li ul, .menutop li li.sfHover li ul, .menutop li li li:hover li ul, .menutop li li li.sfHover li ul{top:-999em;}
    19. .menutop li li:hover ul, .menutop li li.sfHover ul, .menutop li li li:hover ul, .menutop li li li.sfHover ul, .menutop li li li li:hover ul, .menutop li li li li.sfHover ul{left:177px;top:0;}
    20. .menutop li li{position:relative;float:none;width:100%;}
    21. #horiz-menu .menutop li li.sfHover { background-image: none; }
     
    Dervish, Feb 10, 2011
    #5
  7. OlegK
    Offline

    OlegK Russian Joomla! Team Staff Member ⇒ Профи ⇐

    Joined:
    Jan 17, 2011
    Messages:
    7,812
    Likes Received:
    771
    Gender:
    Male
    Код (PHP):
    1. .menutop i ul{float:none;left:-999em;position:absolute;white-space:pre-wrap;width:177px;z-index:500;}

    по моему ошибка верстальщиика "white-space:pre-wrap" а было "prewrap"
     
    OlegK, Feb 10, 2011
    #6
  8. Offline

    Dervish Недавно здесь

    Joined:
    Feb 9, 2011
    Messages:
    17
    Likes Received:
    0
    Gender:
    Male
    не, это я не тот скопировал - это я сам пытался вставить перенос. в оригинале его не было вообще. я код переопубликовал через минуту оригинальный, но вы успели уже первоначальный проверить :).

    да, еще может и вот этот стиль нужен:
    Код (CODE):
    1. /**
    2.  * @version     1.5.4 August 20, 2010
    3.  * @author      RocketTheme, LLC http://www.rockettheme.com
    4.  * @copyright   Copyright (C) 2007 - 2010 RocketTheme, LLC
    5.  * @license     http://www.rockettheme.com/legal/license.php RocketTheme Proprietary Use License
    6.  */
    7. /* MenuStyle 3 */
    8.  
    9. #horiz-menu {display: block;height: 43px;line-height: 43px;padding: 0;background: url(../images/3-horiz-menu-bar.png) 0 0 repeat-x;}
    10. ul#horiznav.menutop, #horiz-menu ul.menutop {padding: 0 6px;margin: 0;position: relative;z-index:120;}
    11. #horiz-menu li {position:relative;z-index:150;}
    12. #horiz-menu li a {margin-left: 5px;position:relative;z-index:200;}
    13. #horiz-menu a, #horiz-menu .separator {white-space: nowrap;display: block;float: left;height: 43px;line-height: 43px;font-weight: normal;font-size: 120%;overflow: hidden;text-decoration: none;z-index: 100;cursor: pointer;padding: 0 10px 0 5px;margin-right: 5px;}
    14. #horiz-menu li.active a, #horiz-menu li.active .separator {z-index: 100;cursor: pointer;height: 43px;}
    15. #sub-menu {height: 32px;line-height: 32px;padding: 1px 0;display: block;z-index: 1;}
    16. #submenu-container {background: url(../images/sub-menu-bar.png) 0 43px repeat-x;}
    17. #sub-menu ul.menusub {padding: 0 8px;margin: 0;position: relative;height: 32px;z-index: 1;}
    18. #sub-menu li a {margin-left: 5px;}
    19. #sub-menu a, #sub-menu .separator {white-space: nowrap;display: block;float: left;height: 32px;line-height: 32px;font-size: 110%;overflow: hidden;text-decoration: none;z-index: 100;cursor: pointer;padding: 0 8px 0 3px;margin-right: 10px;}
    20. #sub-menu ul.menusub li span {padding: 0;margin: 0;height: 32px;line-height: 32px;}
     
    Dervish, Feb 10, 2011
    #7
  9. Offline

    Dervish Недавно здесь

    Joined:
    Feb 9, 2011
    Messages:
    17
    Likes Received:
    0
    Gender:
    Male
    о, поставил кругом пре-врап, теперь пункты меню на середине слова не обрезает, а похоже что переносит, но все равно не видно 2 строчку (на которую перенесено то, что не влезло. до этого обрезало прямо посреди слов.
     
    Dervish, Feb 10, 2011
    #8
  10. OlegK
    Offline

    OlegK Russian Joomla! Team Staff Member ⇒ Профи ⇐

    Joined:
    Jan 17, 2011
    Messages:
    7,812
    Likes Received:
    771
    Gender:
    Male
    "white-space: nowrap" – последовательность пробелов заменяется на один. Перенос на новую строку происходит только после тэга "br." ! пробуй теперь ставить перенос "br."
    "overflow: hidden" и будет скрывать что не помещается в блок
     
    OlegK, Feb 10, 2011
    #9
  11. Offline

    Dervish Недавно здесь

    Joined:
    Feb 9, 2011
    Messages:
    17
    Likes Received:
    0
    Gender:
    Male
    ой блин... я уже в истерике... если оставляем nowrap и ставим в длинном названии пункта меню <br>, который после сохранения становится <br /> - то этот пункт отображается в 2 строки с переносом только в меню менеджере :). когда смотришь в денвере - в самом меню идут 2 слова, потом тупо <br /> и обрезанное посреди 3 слово...
    если ставлю pre-wrap - то обрезанных слов нет, перенос делается. но куда - не видно, т.е. вторая строчка с невлезшими 3 и 4 словами не появляется...
    если при этом поставить overflow: auto вместо hidden - появляется кругом прокрутка (выглядит преотвратно).
    Пните меня пожалуйста, что подровнять в моих руках? ну и голове заодно... т.е. я думаю, что pre-wrap - это правильно, а вот что еще сделать, чтобы появилась вторая строчка у этого пункта меню при переносе?
     
    Dervish, Feb 10, 2011
    #10
  12. OlegK
    Offline

    OlegK Russian Joomla! Team Staff Member ⇒ Профи ⇐

    Joined:
    Jan 17, 2011
    Messages:
    7,812
    Likes Received:
    771
    Gender:
    Male
    OlegK, Feb 10, 2011
    #11
  13. Offline

    Dervish Недавно здесь

    Joined:
    Feb 9, 2011
    Messages:
    17
    Likes Received:
    0
    Gender:
    Male
    так работает же pre-wrap. только не могу теперь увидеть ту часть (3 и 4 слова), которые перенесены. т.е. перенос отрабатывает по идее, но вторая строчка не появляется из-за каких-то других параметров в этом css. грешил на width, пробовал ставить ее в auto, мож не туда пихаю?

    #horiz-menu a, #horiz-menu .separator {width: auto;white-space: pre-wrap;display: block;float: left;height: 43px;line-height: 43px;font-weight: normal;font-size: 120%;overflow: hidden;text-decoration: none;z-index: 100;cursor: pointer;padding: 0 10px 0 5px;margin-right: 5px;}
    и еще тут:
    #sub-menu a, #sub-menu .separator {width: auto;white-space: pre-wrap;display: block;float: left;height: 32px;line-height: 32px;font-size: 110%;overflow: hidden;text-decoration: none;z-index: 100;cursor: pointer;padding: 0 8px 0 3px;margin-right: 10px;}
     
    Dervish, Feb 10, 2011
    #12
  14. OlegK
    Offline

    OlegK Russian Joomla! Team Staff Member ⇒ Профи ⇐

    Joined:
    Jan 17, 2011
    Messages:
    7,812
    Likes Received:
    771
    Gender:
    Male
    так может проблема не в свойствах меню?может блоки смотреть нужно.
    я не могу запустить шаблон Versatility4 в J1.5.22,а включать совместимость с 1.0 не хочу.
    сделай скрин меню.
     
    OlegK, Feb 10, 2011
    #13
  15. Offline

    Dervish Недавно здесь

    Joined:
    Feb 9, 2011
    Messages:
    17
    Likes Received:
    0
    Gender:
    Male
    [​IMG]

    Uploaded with ImageShack.us

    Это по дефаулту (nowrap)

    [​IMG]

    Uploaded with ImageShack.us

    Это при исправлении на pre-wrap

    исправлял в menustyle3. в rokmoomenu эти правки ничего не дают, вернул дефаултовые.
     
    Last edited: Feb 10, 2011
    Dervish, Feb 10, 2011
    #14
  16. OlegK
    Offline

    OlegK Russian Joomla! Team Staff Member ⇒ Профи ⇐

    Joined:
    Jan 17, 2011
    Messages:
    7,812
    Likes Received:
    771
    Gender:
    Male
    ну так конечно не будет переносится текст строки,если следующий элемент разметки идет на своём месте.
    указан размер не в процентах,то есть не резиновая вёрстка.
     
    OlegK, Feb 10, 2011
    #15
  17. Offline

    Dervish Недавно здесь

    Joined:
    Feb 9, 2011
    Messages:
    17
    Likes Received:
    0
    Gender:
    Male
    а исправить-то можно? как сделать по-людски? ну не шарю я, не веб-мастер... обычный ийтишник... ткните пожалуйста меня носом как котенка, что сделать и где... я итак за эти 2 дня пипец как продвинулся в веб-дизайне :))))
     
    Dervish, Feb 10, 2011
    #16
  18. OlegK
    Offline

    OlegK Russian Joomla! Team Staff Member ⇒ Профи ⇐

    Joined:
    Jan 17, 2011
    Messages:
    7,812
    Likes Received:
    771
    Gender:
    Male
    пробуй увеличь высоту элементов.то есть div .
     
    OlegK, Feb 10, 2011
    #17
  19. Offline

    Dervish Недавно здесь

    Joined:
    Feb 9, 2011
    Messages:
    17
    Likes Received:
    0
    Gender:
    Male
    (((. Я ж объяснил - сам не сделаю. все, что мог - уже попытался. сказывается полное отсутствие опыта. но в любом случае спасибо.
     
    Dervish, Feb 14, 2011
    #18
  20. OlegK
    Offline

    OlegK Russian Joomla! Team Staff Member ⇒ Профи ⇐

    Joined:
    Jan 17, 2011
    Messages:
    7,812
    Likes Received:
    771
    Gender:
    Male
    OlegK, Feb 15, 2011
    #19
  21. Offline

    Dervish Недавно здесь

    Joined:
    Feb 9, 2011
    Messages:
    17
    Likes Received:
    0
    Gender:
    Male
    Видел и такие варианты, и тоже бы устроили. но аналогично - я не знаю как этого добиться. понимаю, что ширина должна быть какой-то плавающей, но вот что в css править... методом "научного тыка" ничерта не получается...
    т.е. при инспекте вижу, что на меню выдает:
    ...
    Блочная модель
    width auto
    height auto
    ....
    но вот в каком css - не видно. наверное, не в них дело?
     
    Last edited: Feb 15, 2011
    Dervish, Feb 15, 2011
    #20
Page 1 of 2
< Помогите определить компонент | Новшества в шаблоне 1.5 >

Share This Page

Loading...