Hi,
I have a friend who wants to use her own "branding" type face in menus via sprite gif files. The purpose is that she has her own fonts that she wants to display. I have seen this done elsewhere and have found the following code. I'm trying to map this to what i see in the default.css. Can anyone help me and suggest how i might integrate something similar into the child css?
Here is the snippet i have found elsewhere . . . i know that the classes are called elsewhere by a different function and so probably not the same as here in thematic.
I am thinking one needs to know the right function calls for mapping into thematic. Any ideas?
#menu {
width:auto;
}
#nav {
background:url("images/bg-greyline.gif") repeat-x scroll left center transparent;
border-right:1px solid #CCCCCC;
height:32px;
margin-left:13px;
}
#menumain ul {
float:right;
width:auto;
}
#nav ul {
margin-bottom:0;
margin-top:0;
}
#menumain ul li {
background:none repeat scroll 0 0 #FFFFFF;
float:left;
list-style:none outside none;
}
#menumain ul li a {
background-color:#FFFFFF;
background-position:center bottom;
background-repeat:no-repeat;
display:block;
font-size:0;
height:14px;
line-height:0;
margin:9px 10px;
overflow:hidden;
text-indent:-999em;
}
ul li.home a {
background-image:url("images/nav-home-sprite.gif");
width:34px;
}
li.about a {
background-image:url("images/nav-about-sprite.gif");
width:106px;
}
li.speaking a {
background-image:url("images/nav-speaking-sprite.gif");
width:154px;
}
li.other a {
background-image:url("images/nav-other-sprite.gif");
width:103px;
}
li.contact a {
background-image:url("images/nav-contact-sprite.gif");
width:54px;
}
li.books a {
background-color:#F1F1F1 !important;
background-image:url("images/nav-books-sprite.gif");
border-left:1px solid #CCCCCC;
width:41px;
}
#menumain ul li a:hover {
background-position:center top;
}
#menumain li.books, #menumain li.books li {
background:none repeat scroll 0 0 #F1F1F1 !important;
position:relative;
z-index:999;
}
#nav li.books ul {
background:none repeat scroll 0 0 #F1F1F1;
border-bottom:1px solid #CCCCCC;
border-left:1px solid #CCCCCC;
border-top:1px solid #CCCCCC;
bottom:-34px;
display:inline;
float:right;
margin:0;
padding:0;
position:absolute;
right:0;
width:316px;
z-index:-1;
}
li.books {
border-left:1px solid #CCCCCC;
}
#nav li.books li.drive a {
background-image:url("images/subnav-drive-sprite.gif");
border-left:medium none;
width:35px;
}
#nav li.books li.wnm a {
background-image:url("images/subnav-wnm-sprite.gif");
border-left:medium none;
width:124px;
}
#nav li.books li.johnnybunko a {
background-image:url("images/subnav-johnnybunko-sprite.gif");
border-left:medium none;
width:95px;
}
#menumain li.books li a {
}