I've just written a CSS/HTML flyout menu as an addition to an existing system (
EQdkp Plus, to be specific). The menu is generated by a couple PHP functions. The output is an unordered list as in this pseudocode:
-
<div class="menu">
-
<ul>
-
<li>Entry
-
<ul>
-
<li>Submenu Entry</li>
-
</ul>
-
</li>
-
</ul>
-
</div>
I want to add submenu headings to my list, which is quite simple:
-
stuff
-
<li class="menuheading">Submenu Heading</li>
-
<li>Submenu Entry</li>
-
stuff
However, I want to make the headings have the same visual style as the style template that's currently in use by the system. This is where my problem lies. Every style template defines its menu headings like this:
-
th.smalltitle {
-
font-weight: something;
-
color: something;
-
background-color: something;
-
more stuff
-
}
I wish it was just .smalltitle instead of th.smalltitle; then I'd be able to simply write <li class="menuheading smalltitle">. And due to some limitations with both the system and HTML/CSS, I cannot use tables inside the menu. So, I need some way to inherit or copy the smalltitle class, like saying
-
li.menuheading inherits th.smalltitle
Is there any way to do this?