Elxis CMS Forum
Extensions => Templates => Topic started by: armpouniotis on November 10, 2013, 18:40:05
-
Hi there !
I want to have 2 horizontal menus in my website, but with different style each one of them (colors, font family, font size etc).
How can I do that in CSS ???
So far, I have 2 horizontal menus with the same style...
thank you in advance
Christos
-
You can add a CSS suffix in one of the 2 modules.
Elxis (4.x is this what you use?) places module with in a <div class="module"> container. If you add a suffix such as "_test" the container will become <div class="module_test">
This way you can set different style on the menu.
.module ul.elx_menu { background-color:red; }
.module_test ul.elx_menu { background-color:green; }
If you include the menu modules in your template without the wrapper then you should use the template's wrapper element to separate them.
<div class="menu1">
<?php echo $eDoc->modules('menua', 'none'); ?>
</div>
<div class="menu2">
<?php echo $eDoc->modules('menub', 'none'); ?>
</div>
.menu1 ul.elx_menu { background-color:red; }
.menu2 ul.elx_menu { background-color:green; }
-
ok ! I got it !
I was a little bit confused by the CSS style of the menu, but not it is understood !
That's perfect !
thank you !!!