menu and submenu horizontal

We encourage users to post events happening in the community to the community events group on https://www.drupal.org.
SakaSerbia's picture

Hi, I true 2 week to do this, and i dont know how..:(

I want tu make menu and submenu horizontal, and that submenu dont vanish. Like here

http://www.savio.no/artikler/a/333/horizontal-and-tabbed-css-menu-with-s...

but my code is this:

<?php

         
if (module_exists('i18n_menu')) {
           
$main_menu_tree = i18n_menu_translated_tree(variable_get('menu_main_links_source', 'main-menu'));
          } else {
           
$main_menu_tree = menu_tree(variable_get('menu_main_links_source', 'main-menu'));
          }
          print
drupal_render($main_menu_tree);
       
?>

and css

/* =Menu
-------------------------------------------------------------- */

header #navigation {

clear: both;
display: block;
float: left;
margin: 0 auto 2px;
width: 100%;
background: url('images/menu_bg.png');
}

main-menu > ul.menu{

font-size: 14px;
list-style: none;
margin: 0;
padding-left: 0;
}

main-menu > ul.menu li {

border-right: 1px solid rgb(0, 103, 151);
float: left;
position: relative;
list-style: none outside none;
}

main-menu > ul.menu a {

color: #fff;
line-height: 3em;
padding: 0 1.2125em;
text-decoration: none;
}

main-menu > ul.menu a {

display: block;
}

main-menu > ul.menu ul {

-moz-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
-webkit-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
box-shadow: 0 3px 3px rgba(0,0,0,0.2);
display: none;
float: left;
margin: 0;
position: absolute;
top: 3em;
left: 0;
list-style: none;
width: 188px;
z-index: 99;
}

main-menu > ul.menu ul ul {

left: 100%;
top: 0;
}

main-menu > ul.menu ul a {

background: #f9f9f9;
border-bottom: 1px dotted #ccc;
color: #444;
font-size: 13px;
font-weight: normal;
height: auto;
line-height: 1em;
padding: 10px;
width: 168px;
}

main-menu > ul.menu li:last-child,

main-menu > ul.menu ul li {

border:none;
}

main-menu > ul.menu li:hover > a,

main-menu > ul.menu ul :hover > a,

main-menu > ul.menu a:focus {

background: #efefef;
}

main-menu > ul.menu li:hover > a,

main-menu > ul.menu a:focus{

background: #169FE6;
color: #fff;
}

main-menu > ul.menu li:hover > ul {

display: block;
}

main-menu > ul.menu a.active {

color: #fff;
background: #169FE6;
}

main-menu ul li.leaf, #main-menu ul li.expanded { list-style: none; }

.tinynav {
display: none;
font-size: 16px;
}

Omega Framework

Group organizers

Group notifications

This group offers an RSS feed. Or subscribe to these personalized, sitewide feeds: