Добрый день! Сразу к делу вот есть демо шаблона http://joomla15.lernvid.com/?template=blueish Авот как он стоит у меня http://www.bel-web.tk Пожалуйста подскажите как мне настроить такое же верхнее меню. Спасибо!
Значит порылся и вот что нашел если добавить в админке к модулю добавить Суффикс CSS-класса меню "-nav" то моё верхнее меню становиться красивым, но не выпадающим. В демо шаблона в <ul class="menu_lv_dropdown"> - как я понял отвечает за вывод выпадающего меню, а у меня в шаблоне после того как я прописал Суффикс CSS-класса меню получается <ul id="mainlevel-nav". На сайте имееться файл lv-dropdown.css Код (html): .menu_lv_dropdown, .menu_lv_dropdown ul{ margin:0; padding:0; list-style-type:none; list-style-position:outside; position:relative; line-height:1.5em; z-index:99; display:inline-block; } .menu_lv_dropdown { border-left:1px solid #333; border-right: 1px solid #000; } .menu_lv_dropdown ul { border:2px solid #000; padding:5px; background-color:#222; -moz-border-radius: 10px; -moz-box-shadow: 0 0 10px #000; -webkit-border-radius: 10px; -webkit-box-shadow: 0 0 10px #000; } .menu_lv_dropdown li, .menu_lv_dropdown ul li { list-style:none; } .menu_lv_dropdown li.parent a span, .menu_lv_dropdown li.parent li.parent a span, .menu_lv_dropdown li.parent li.parent li.parent a span { padding-left:18px; background-image: url('../images/down.png'); background-repeat:no-repeat; } .menu_lv_dropdown li.parent li a span, .menu_lv_dropdown li.parent li.parent li a span, .menu_lv_dropdown li.parent li.parent li.parent li a span { border:0; background-image:none; } .menu_lv_dropdown a { display:block; padding:20px 15px; border:1px solid #000; border-right:1px solid #333; border-bottom:1px solid #333; color:#fff; text-decoration:none; background-color:#222; background-image: url('../images/dropdown.png'); background-repeat: repeat-y; } .menu_lv_dropdown li{ float:left; position:relative; } .menu_lv_dropdown ul { position:absolute; display:none; width:16.15em; top:4.5em; } .menu_lv_dropdown li ul a{ width:15em; height:auto; float:left; padding:10px 1em 10px 0; } .menu_lv_dropdown ul ul{ top:auto; } .menu_lv_dropdown li ul ul { left:15em; margin:0px 0 0 10px; } .menu_lv_dropdown li:hover ul ul, .menu_lv_dropdown li:hover ul ul ul, .menu_lv_dropdown li:hover ul ul ul ul{ display:none; } .menu_lv_dropdown li:hover ul, .menu_lv_dropdown li li:hover ul, .menu_lv_dropdown li li li:hover ul, .menu_lv_dropdown li li li li:hover ul{ display:block; } и собственно содержание tamplate.css Код (html): /********************************************* *** Designed by Juergen Koller *** *** Designers Home: http://www.LernVid.com *** **********************************************/ /****************** LAYOUT ******************/ html { height:100%; } body { font-family:Arial, Helvetica, Sans-Serif; margin: 0; padding: 0; font-size:14px; line-height:1.5em; } #top { height:22px; background-color:black; background-image: url('../images/top.gif'); } #bg_up { background-image: url('../images/bg_up.jpg'); background-repeat:no-repeat; background-position: center top; } #header, #user_outer, #wrapper { max-width: 1200px; min-width: 950px; margin:0 auto; } #wrapper { background-image: url('../images/wrapper.png'); background-position: center top; background-repeat:repeat-y; margin-bottom:20px; } #header { min-height: 120px; position:relative; } #nav_outer { background-image: url('../images/nav.png'); background-repeat:no-repeat; height:99px; } /* logos */ #header a#imglogo { float:left; } #header a#logo { display:block; padding:15px 0 0 0; min-height:65px; line-height:normal; width:auto; font-size:42px; } #headermodule1 p { margin:0; padding::0; } #header #slogan { display:block; padding:15px 0 0 0; min-height:40px; line-height:normal; width:69%; font-size:22px; color: #1b6aac; } #header a#logo:hover {text-decoration:none;} /* logos end */ #user_outer { position:relative; min-height:64px; padding-top:18px; } #slider { display:inline-block; width:auto; height:auto; margin: 0 0 10px 0; } #container { padding: 20px 2%; } /* Feed entrys */ #syndicate { text-align:right; width:67%; position:absolute; margin:10px; } /* Feed entrys end */ #content_out { padding:0; } #maincontent { padding: 0 0 10px 0; overflow:hidden; } #rightcol { font-size:13px; float:right; border-right:0; } /* right modules */ #rightcol .module, #rightcol .module_menu, #rightcol .module_text { padding:0; margin:0 0 22px 0;; } #rightcol .module .div-2, #rightcol .module_menu .div-2, #rightcol .module_text .div-2 { padding:5% 10%; } .module h3.lvrounds, .module_text h3.lvrounds, .module_menu h3.lvrounds { margin:0 0 7px 0; padding:0; font-size:16px; font-family:Georgia; font-style:italic; } /* right modules end */ /* articles */ .eintrag { display:inline-block; width:100%; margin: 0 0 20px 0; } .eintrag-topl, .div-topl { background-image: url('../images/eintrag-lt.png'); background-repeat:no-repeat; height:26px; } .eintrag-topr, .div-topr { height:26px; } .eintrag-1, .div-1 { background-image: url('../images/eintrag-l.png'); background-repeat:repeat-y; } .eintrag-2, .div-2 { padding:1% 6%; } .eintrag-bottoml, .div-bottoml { background-image: url('../images/eintrag-lb.png'); background-repeat:no-repeat; height:26px; } .eintrag-bottomr, .div-bottomr { height:26px; } /* articles end */ #wrapper-2 { } #footer { max-width: 1280px; min-width: 930px; margin:0 auto; text-align:center; min-height: 50px; padding:10px; } a#gotop { text-align:right; display:block; font-style:italic; text-transform:uppercase; } .copyright, .copyright a { font-size:10px; } /****************** LAYOUT END ******************/ /****************** MENUS ******************/ /* MAINMENU right */ .module_menu ul.menu, .module_menu ul.menu ul { margin:0; padding: 0 0 0 20px; } .module_menu ul.menu li { margin:2px 0; padding:0; } .module_menu ul.menu li a { display:block; } /* Standard TOPMENU user3 */ ul#mainlevel-nav, ul#mainlevel-nav li { margin:0; padding:0; list-style:none; } ul#mainlevel-nav { display:inline-block; height:64px; border-left:1px solid #333; } ul#mainlevel-nav li { display:inline; float:left; padding:0; margin:0; } ul#mainlevel-nav li a { display:block; padding:20px 15px; border:1px solid #000; border-right:1px solid #333; border-bottom:1px solid #333; color:#fff; text-decoration:none; background-color:#222; background-image: url('../images/dropdown.png'); background-repeat: repeat-y; } ul#mainlevel-nav li a:hover { text-decoration:none; } /****************** MENUS END ******************/ /****************** SEARCH user4 ******************/ #search { position:absolute; right:15px; top:-50px; width: 22%; height:40px; } #search input.button { margin-left: 5px; background-image:none; border:0; } #search .inputbox { background-image: url('../images/search.png'); background-repeat:no-repeat; background-position: 3px 3px; padding: 5px 5px 5px 25px; border:0; border:1px solid; } /****************** SEARCH user4 end ******************/ /****************** JOOMLA THINGS ******************/ .contentdescription { display:inline-block; width: 98%; margin: 5px 0; padding: 1%; } /* Search Component */ .results li { padding-bottom:5px; margin-bottom:25px; border-bottom:1px dotted; } form.search_result fieldset { border:solid 2px; padding:20px; margin:10px 0; } .highlight { color : #ff0000; font-weight:bold; font-family: Verdana; padding : 0 5px; } /* Search Component end */ /* Poll Component */ table.poll { padding : 0; width : 100%; border-collapse : collapse; } table.pollstableborder { padding : 0; width : 99%; border : none; text-align : left; border: 2px solid; } table.pollstableborder th { padding : 5px; border:1px solid; font-size:18px; } table.pollstableborder img { vertical-align : baseline; padding-left : 10px; } table.pollstableborder td { border: 1px solid; padding : 5px; border-collapse : collapse; border-spacing : 0; } table.pollstableborder tr.sectiontableentry1 td { margin : 1px; padding : 2px 5px 2px 5px; } table.pollstableborder tr.sectiontableentry2 td { margin : 1px; padding : 2px 5px 2px 5px; } table.pollstableborder tr.sectiontableentry0 td { margin : 1px; padding : 2px 5px 2px 5px; } .poll dt { font-weight:bold; font-size:16px; float:left; margin-right: 20px; } .poll dd { } form.poll fieldset input { background:none; border: 0; } /* Poll Component end */ /* COMPONENT CONTACT */ table.contact-category { width: 100%; } table.contact-category td { padding: 8px; border: 1px solid; } table.contact-category th { padding: 8px; border: 1px solid; } div.contact { margin:10px 0; } address { font-style:normal; margin:10px 0; } address p { line-height:1em; } .contact label { float:left; font-weight:bold; width:14em; margin:10px 0 0; } span.marker { margin:0 10px 0 0; } .contact_email_checkbox label { float:none !important; } .contact label.copy { width:90%; padding:0 0 0 10px; } .contact form { padding:20px; margin:10px 0; } .contact input { padding:2px 2px 0; margin:10px 0 0; } .contact .button { font-weight:bold; margin:20px 10px 0 0; cursor:pointer; } label.textarea { float:none !important; margin:10px 0; display:block; width:100%; } #contact_text { width:80%; height:150px; } .contact input.invalid,.contact textarea.invalid { border:solid 2px red; } .contact label.invalid { color:red; } /* COMPONENT CONTACT END */ /* contact */ .contact_email { padding : 5px; margin : 5px; } div.contact { margin:10px 0; } address { font-style:normal; margin:10px 0; } address p { line-height:1em; } .contact label { float:left; font-weight:bold; width:14em; margin:10px 0 0; } span.marker { margin:0 10px 0 0; } .contact_email_checkbox label { float:none !important; } .contact label.copy { width:90%; padding:0 0 0 10px; } .contact form { padding:20px; margin:10px 0; } .contact input { padding:2px 2px 0; margin:10px 0 0; } .contact .button { font-weight:bold; margin:20px 10px 0 0; cursor:pointer; } label.textarea { float:none !important; margin:10px 0; display:block; width:100%; } #contact_text { width:80%; height:150px; } .contact input.invalid,.contact textarea.invalid { border:solid 2px red; } .contact label.invalid { color:red; } /* contact end */ .display, .filter { margin: 15px; } .sectiontableheader { font-size:18px; font-weight:bold; text-align : left; text-transform : none; margin : 0; padding:5px 10px; border: 1px dotted; } .sectiontablefooter { padding : 2px; margin : 0; text-align : left; text-transform : none; } .sectiontableentry1 td { line-height: 25px; padding:5px 10px; margin : 1px; border: 1px dotted; } .sectiontableentry2 td { line-height: 25px; padding:5px 10px; margin : 1px; border: 1px dotted; } .sectiontableentry0 td { line-height: 25px; padding:5px 10px; margin : 1px; border: 1px dotted; } .sectiontableentry0, sectiontableentry1, sectiontableentry2 { text-align : left; } .invalid { border-color: #ff0000; } label.invalid { color: #ff0000; } a.cat, a.sec { font-size:12px; } div.moduletable, div.moduletable_text, div.moduletable_menu { padding:10px; } span.breadcrumbs a { font-weight:bold; color:#205677; } span.breadcrumbs { margin:3px 0 0 0; padding: 0 20px 3px 0; display:block; line-height:15px; text-align:right; font-size:10px; position:absolute; top:-22px; right:50px; background-image : url(../images/breadcrumb.png); background-repeat:no-repeat; background-position: right top; } .leading_separator { display: block; height: 10px; margin:0; } .article_separator { display: block; height: 10px; margin:0; } .blog_more { padding: 20px } .blog_more h2 { font-weight:normal; font-size:12px; } p.counter { text-align:right; padding:20px; } .componentheading { font-size:11px; font-weight:normal; margin:3px 0 0 20px; padding: 0 5px 0 20px; line-height:15px; text-align:left; position:absolute; top:0; background-image: url('../images/compo.png'); background-repeat:no-repeat; } h1.contentheading { font-size:17px; font-style:italic; font-family:Georgia; margin:0 0 20px 0; padding:0; } h1.contentheading span { padding:0 3px 2px 3px; } .buttonheading { float:right; padding: 0 0 5px 10px; } .buttonheading a { padding: 0 0 3px 7px; clear:both; } .iteminfoz { font-size:8.5px; float:right; } .iteminfo { font-size:8.5px; display:inline-block; margin: 5px 0 0 0; padding:0; } .createdate, .createdby, .modifydate { float:left; height:auto; margin:2px; padding: 2px 7px 2px 24px; background-repeat:no-repeat; background-position: 5px 5px; } .createdate { background-image : url(../images/create.png); } .createdby { background-image : url(../images/createdby.png); } .modifydate { background-image : url(../images/modify.png); } a.readon { padding:5px; } .pageinfo { display:block; padding:10px; text-align:right; } .weblinks a.category { font-size:16px; display:inline-block; height: 35px; width: auto; padding-left: 10px; } #system-message { color: blue; } /* Editor */ .contentpaneopen_edit{ text-align:right; } .contentpaneopen_edit img { border:0 } form.editor legend { font-size:1.2em; font-weight:bold; padding:2px; } form.editor fieldset { border:solid 1px; padding:20px; margin:10px 0; } form.editor .publishing label { float:left; width:14em; font-weight:bold; } form.editor .publishing div { margin:5px 0; } form.editor .publishing .radio label { float:none; width:14em; } form.editor .publishing .radio label span { float:left; width:14em; } form.editor fieldset.metadata label { float:none !important; display:block; font-weight:bold; } .save { text-align:right; padding:10px 0; } /* Editor end */ /* -- buttons */ #editor-xtd-buttons { padding: 5px; } .button2-left, .button2-right, .button2-left div, .button2-right div { float: left; } .button2-left a, .button2-right a, .button2-left span, .button2-right span { display: block; height: 22px; float: left; line-height: 22px; font-size: 11px; color: #666; cursor: pointer; } .button2-left span, .button2-right span { cursor: default; color: #999; } .button2-left .page a, .button2-right .page a, .button2-left .page span, .button2-right .page span { padding: 0 6px; } .page span { color: #000; font-weight: bold; } .button2-left a:hover, .button2-right a:hover { text-decoration: none; color: #0B55C4; } .button2-left a, .button2-left span { padding: 0 24px 0 6px; } .button2-right a, .button2-right span { padding: 0 6px 0 24px; } .button2-left { float: left; margin-left: 5px; } .button2-right { float: left; margin-left: 5px; } body.contentpane { background-color:#fff; } form#login label { display:block; padding:10px 0 3px 0; font-weight:bold; } form#login fieldset { border: 10px solid #333; padding: 20px; color: #fff; } /* Section List */ ul.sectionentry li { margin:0 10px 30px 10px; padding: 0 30px; border-bottom: 3px double; } ul.sectionentry li a.category { font-size:18px; display:block; } ul.sectionentry li .small { float:right; display:block; text-align:right; font-size:11px; } /* Section List end */ /****************** JOOMLA THINGS END ******************/ /****************** HTML THINGS ******************/ .button, input, .validate, .inputbox, .pagenav, .pagenav_next, .pagenav_prev { border:0; font-size:11px; padding: 3px 6px; margin: 0 5px; background-image:url('../images/button.gif'); background-repeat:repeat-x; } td { font-size:14px; } .clr { clear:both; } a, a:link, a:visited, a:active, a:focus { text-decoration:none; } a:hover { text-decoration:underline; } input, button { font-size:10px; } img, a, fieldset { border:0; outline:0; } /****************** HTML THINGS END ******************/ Прошу вашей помощи