CMS Made Simple Forums

Posted: **Mon Jun 14, 2010 7:33 pm**

hello, please, can you help me?
is it possible to make in this CMS this menu ? : CSS menu with image sprites

I have functionally menu, it's super and I dont know how to implement this menu to this CMS

this is my functionally code:

Code: Select all

<div id="menu">
<ul id="main-menu">
      <li><a href="./" class="ofirme"></a></li>
      <li><a href="" class="okna"></a></li>
      <li><a href="" class="dvere"></a></li>
      <li><a href="" class="nabytok"></a></li>
      <li><a href="" class="interier"></a></li>
      <li><a href="" class="referencie"></a></li>
       <li><a href="" class="kontakt"></a></li>
</ul>
</div>

and my css:

Code: Select all

#menu {
	position:absolute;
	top: 48px;
	left: 307px;
}

ul#main-menu {
	width: 647px;
	list-style: none;
	text-align:center;
	font-size: 12px;
	margin: 0;
	padding: 0;
}
ul#main-menu li {
	display: inline;
}
ul#main-menu li a {
	display: block;
	float: left;
	height: 58px;
	color:#FFFFFF;
	text-decoration: none;
	background-image: url(../pictures/drevenyraj_main-menu.jpg);
}
ul#main-menu li a:hover {
	text-decoration: underline;
}
ul#main-menu li a.ofirme {
	width: 89px;
	background-position: 0 0;
}
ul#main-menu li a.okna {
	width: 86px;
	background-position: -89px 0;
}
ul#main-menu li a.dvere {
	width: 79px;
	background-position: -176px 0;
}
ul#main-menu li a.nabytok {
	width: 101px;
	background-position: -255px 0;
}
ul#main-menu li a.interier {
	width: 85px;
	background-position: -356px 0;
}
ul#main-menu li a.referencie {
	width: 111px;
	background-position: -441px 0;
}
ul#main-menu li a.kontakt {
	width: 95px;
	background-position: -552px 0;
}
ul#main-menu li a.ofirme:hover, ul#main-menu li a.ofirme:focus, ul#main-menu li a.ofirme_active {
	width: 89px;
	background-position: 0 -58px;
}
ul#main-menu li a.okna:hover, ul#main-menu li a.okna:focus, ul#main-menu li a.okna_active {
	width: 86px;
	background-position: -89px -58px;
}
ul#main-menu li a.dvere:hover, ul#main-menu li a.dvere:focus, ul#main-menu li a.dvere_active {
	width: 79px;
	background-position: -176px -58px;
}
ul#main-menu li a.nabytok:hover, ul#main-menu li a.nabytok:focus, ul#main-menu li a.nabytok_active {
	width: 101px;
	background-position: -255px -58px;
}
ul#main-menu li a.interier:hover, ul#main-menu li a.interier:focus, ul#main-menu li a.interier_active {
	width: 85px;
	background-position: -356px -58px;
}
ul#main-menu li a.referencie:hover, ul#main-menu li a.referencie:focus, ul#main-menu li a.referencie_active {
	width: 111px;
	background-position: -441px -58px;
}
ul#main-menu li a.kontakt:hover, ul#main-menu li a.kontakt:focus, ul#main-menu li a.kontakt_active {
	width: 95px;
	background-position: -552px -58px;
}

it's full functionally, but is it possible to make this menu in this CMS?

i try this:

Code: Select all

<div id="menu">
{menu}
</div>

but it's not good

please, help

Posted: **Mon Jun 14, 2010 9:57 pm**

Your original code is good, but implementaition isn't good:

{menu}

If yoy want make the same efect, you have to declare ul, li etc. on id="menu".
You can do this like in below:

#menu {
position:absolute;
top: 48px;
left: 307px;
}

div#menu ul {
.......your code ....}

div#menu ul li {
....... your code ......}

etc....

I dont know how is construction div #menu and #main_menu, but if I thing good, #main_menu is for ul class (and others) in conatiner #menu. Including tag {menu} you didn't definied style for ul, li, a, a: hover etc. Please rewrite all #main_menu.

Best regards,
Marek A.

Posted: **Tue Jun 15, 2010 6:37 pm**

Copy one of the menu templates, like simple_navigation, then open it and change the ul id at the top to what you need and add {$node->alias} to the 'a href' class...

CMS Made Simple Forums

problem with css menu

problem with css menu

Re: problem with css menu

Re: problem with css menu