Here we go…in three steps:
Step 1: ja.cssmenu.css (line 80) Change the “line-height” to whatever size you want.
#ja-cssmenu li a {
background:#CCCCCC url(../../images/tab-bg.gif) no-repeat scroll center bottom;
color:#333333;
display:block;
font-size:100%;
font-weight:bold;
line-height:30px;
margin:0pt 2px 0pt 0pt;
padding:0pt 20px;
text-decoration:none;
Step 2: ja.cssmenu.css (line 20) – Change the “height” to exactly the same height as you changed previously.
#ja-cssmenu {
height:30px;
margin:0pt;
padding:0pt;
}
Step 3: Resize the “tab-bg.gif” image using Photoshop or whatever. The rollover effect in this menu is done via an image rather than straight CSS code.
The tab rollover image is found: “… /templates/ja_barite/images/tab-bg.gif”
This must be DOUBLE the height you changed to above.
For instance: The template ships with the default menu height at “30”…and the default tab-bg.gif height is “60 px.” (The image is actually 500 px wide by 60 px high)
If you want to increase the menu height to “40” then the “tab-bg.gif” height needs to be “80” (40 px per each color).
Hope that’s clear…and hope that works for you!
John.
