Firefox 10.0.2

37 views
Skip to first unread message

Nick Coppola

unread,
Jun 28, 2012, 12:01:55 AM6/28/12
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;
}
Reply all
Reply to author
Forward
0 new messages