Defining a stylesheet for the menus
January 19, 1999
Defining a stylesheet for the menus.
<style type="text/css" title="menustyles">
div.item {
position : absolute;
width : 250px;
left : 0px;
z-index : 1;
font-family : Arial, Helvetica;
font-size : 10pt;
line-height : 14pt;
font-weight : bold;
font-style : normal;
}
div.headline {
position : absolute;
width : 250px;
left : 0px;
z-index : 1;
font-family : Arial, Helvetica;
font-size : 12pt;
line-height : 16pt;
font-weight : bold;
font-style : italic;
text-transform : uppercase;
}
#itemlayer {
position : absolute;
width : 250px;
left : 0px;
z-index : 1;
font-family : Arial, Helvetica;
font-size : 10pt;
line-height : 14pt;
font-weight : bold;
font-style : normal;
text-align : left;
padding : 0px;
}
#headlinelayer {
font-family : Arial, Helvetica;
font-size : 12pt;
line-height : 16pt;
font-weight : bold;
font-style : italic;
text-align : left;
padding : 0px;
text-transform : uppercase;
}
</style>
|
This next bit of code defines a
stylesheet for the page.
Actually, two sets of styles are created here, one
set for Internet Explorer (div.item and div.headline)
and one set for Navigator (#itemlayer
and #headlinelayer). The headline styles will
be used to render the topic name within each pop-up menu,
for example, "Auto" for the auto insurance menu.
The item styles will render each item in the menu, in
other words, each article link. The specific parameters
chosen for these styles reflect the client's wishes but
could, of course, represent any aesthetic taste.
Building the Imperfect Beast: Part 2 (popups.html)
DHTML Pop-Up Menus: A Parable of Triumph and Loss (Based on a True Story)
Creating the menu arrays and global color values
|
