How to style the different levels using CSS?
12 years 4 months ago #4451
by jcdaddi
How to style the different levels using CSS? was created by jcdaddi
Hi CEd,
I would like to style the different level links using the CSS. I read the manual but couldn't control it well. Could you please shed some light.
As an experiment, I just tried to use a different background colour on the different level links.
In /modules/mod_accorddeonck/themes/default/mod_accordeonck_css.php, I made the following changes:
Here is the output:
testmmogs.cmccharismatic.org/index.php/s...15/2a-item1-subitem1
Here are a few observations:
1) When I set the CSS of AccordeonCK module to show levels 1 to ALL, it only picks up the level 1 background colour (i.e. red in this case) and the entire menu is in that background colour
2) When I set the module to show levels 2 to ALL, it picks up the background colour at level 2, but for some reason, the level 2 menu that has no sub-menu items (e.g. 2C in the example) is not coloured.
3) One question: when I set both the CSS background colour, and also the parameters in the AccordeonCK module, which one takes precedence?
Again, what I want to achieve is something like in the first module "Joomla menu: 2 to ALL". That is, for menu items at the same level (regardless of whether it has sub-menu items) to have the same colour (or shades of grey).
Many thanks in advance.
jcdaddi
I would like to style the different level links using the CSS. I read the manual but couldn't control it well. Could you please shed some light.
As an experiment, I just tried to use a different background colour on the different level links.
In /modules/mod_accorddeonck/themes/default/mod_accordeonck_css.php, I made the following changes:
/*
-- Level 1 --
*/
/* first level (root) link */
<?php echo $id; ?> li.level1 {
background: red;
}
/*
-- Level 2 --
*/
/* second level link */
<?php echo $id; ?> li.level2 {
background: blue;
}
/*
-- Level 3 and more --
*/
/* third and deeper level link */
<?php echo $id; ?> li.level2 li {
background: none;
}
Here is the output:
testmmogs.cmccharismatic.org/index.php/s...15/2a-item1-subitem1
Here are a few observations:
1) When I set the CSS of AccordeonCK module to show levels 1 to ALL, it only picks up the level 1 background colour (i.e. red in this case) and the entire menu is in that background colour
2) When I set the module to show levels 2 to ALL, it picks up the background colour at level 2, but for some reason, the level 2 menu that has no sub-menu items (e.g. 2C in the example) is not coloured.
3) One question: when I set both the CSS background colour, and also the parameters in the AccordeonCK module, which one takes precedence?
Again, what I want to achieve is something like in the first module "Joomla menu: 2 to ALL". That is, for menu items at the same level (regardless of whether it has sub-menu items) to have the same colour (or shades of grey).
Many thanks in advance.
jcdaddi
Please Log in or Create an account to join the conversation.
Time to create page: 0.197 seconds