Nick Coppola
unread,Jun 28, 2012, 12:01:55 AM6/28/12Sign in to reply to author
Sign in to forward
You do not have permission to delete messages in this group
Either email addresses are anonymous for this group or you need the view member email addresses permission to view the original message
to cufón
Hello,
I'm having an issue with cufon where if I replace text that is within
an anchor inside a line item, inside a ul, inside a div, the anchor
text no longer is vertical-aligned middle.
The purpose of this code is to create a horizontal nav...
html
<div id="menu">
<div>
<div>
<ul>
<li class="act"><a href="index.html"><span>main
page</span></a></li>
<li><a href="index-1.html">about us</a></li>
<li><a href="index-2.html">services</a></li>
<li><a href="index-3.html">projects</a></li>
<li><a href="index-4.html">benefits</a></li>
<li><a href="index-5.html"><strong>contacts</
strong></a></li>
</ul>
</div>
</div>
</div>
styles
#menu {
background: url(images/menu-tail.gif) repeat-x 0% 0%;
height: 54px;
overflow: none;
position: absolute;
top: 115px;
left: 330px;
}
#menu div {
background: url(images/menu-left.gif) no-repeat 0% 0%;
height: 54px;
}
#menu div div {
background: url(images/menu-right.gif) no-repeat 100% 0%;
height: 54px;
}
#menu div div ul {
overflow: none;
}
#menu div div ul li {
float: left;
text-transform: uppercase;
font-size: 1.417em;
font-weight: 400;
color: #464e53;
}
#menu div div ul li a {
display: block;
height: 54px;
float: left;
padding: 0 14px 0 14px;
line-height: 54px;
text-decoration: none;
color: #464e53;
}
#menu div div ul li a:hover {
background: url(images/menu-act.gif) repeat-x 0% 0%;
color: #fff;
}
#menu div div ul li a span {
display: block;
padding: 18px 0 0 5px;
}
#menu div div ul li a:hover span {
background: url(images/menu-act-left.gif) no-repeat 0% 0%;
display: block;
margin: 0 0 0 -14px;
padding: 0 0 0 19px;
}
#menu div div ul li a strong {
display: block;
padding: 0 22px 0 0;
font-weight: 400;
}
#menu div div ul li a:hover strong {
background: url(images/menu-act-right.gif) no-repeat 100% 0%;
display: block;
margin: 0 -14px 0 0;
padding: 0 36px 0 0;
}
#menu div div ul li.act a {
background: url(images/menu-act.gif) repeat-x 0% 0%;
color: #fff;
}
#menu div div ul li.act a span {
background: url(images/menu-act-left.gif) no-repeat 0% 0%;
display: block;
margin: 0 0 0 -14px;
padding: 0 0 0 19px;
}
#menu div div ul li.act a strong {
background: url(images/menu-act-right.gif) no-repeat 100% 0%;
display: block;
margin: 0 -14px 0 0;
padding: 0 36px 0 0;
}