Mon, 2011-09-12 21:08
I have created a class for my links which applies only to the current page. The font style remains, but the background image only appears when you hover over it. Can anyone see what I have done incorrectly with my text and help me fix this problem?
CSS:
a{ font-family:Arial,Helvetica,sans-serif; color:#034EA2; font-size:14px; } a:hover{ font-weight:bold; color:#034EA2; } a.active{ color:#034ea2; font-weight:bold; font-family:Georgia, "Times New Roman", Times, serif; } body{ margin:auto; height:900px; width:1024px; font-family:Arial, Helvetica, sans-serif; color:#333; font-size:14px; } .current{ color:#034ea2; font-weight:bold; font-family:Georgia, "Times New Roman", Times, serif; } .links{ display:block; height:79px; width:127px; line-height:79px; text-align:center; background-repeat:no-repeat; font-family:Georgia,"Times New Roman",Times, serif; font-size:12px; text-decoration:none; color:#333; } .spacer{height:10px;} #backdrop{ background-image:url(backdrop4.gif); background-repeat:no-repeat; height:824px; background-position:center center; width:1024px; } #header{ background-repeat:no-repeat; background-position:50% 100%; height:174px; } #link1{ background-image:url(link1.gif); background-repeat:no-repeat; margin-left:525px; margin-top:-177px; } #link1.current, #link1:hover, #link1:active{background-image:url(link1_a.gif);} #link2{ background-image:url(link2.gif); background-repeat:no-repeat; margin-left:802px; margin-top:-81px; } #link2.current, #link2:hover, #link2:active{background-image:url(link2_a.gif);} #link3{ background-image:url(link3.gif); background-repeat:no-repeat; margin-left:669px; margin-top:6px; } #link3.current, #link3:hover, #link3:active{background-image:url(link3_a.gif);} #link4{ background-image:url(link4.gif); background-repeat:no-repeat; margin-left:455px; margin-top:-61px; } #link4.current, #link4:hover, #link4:active{background-image:url(link4_a.gif);} #link5{ background-image:url(link5.gif); background-repeat:no-repeat; margin-left:858px; margin-top:-78px; } #link5.current, #link5:hover #link5:active{background-image:url(link5_a.gif);} #masthead{ background-image:url(masthead.gif); margin-left:20px; height:174px; width:840px; } #melanie{ margin-left:60px; height:120px; width:310px; text-align:center; font-size:16px; padding-top: 20px; } #melanie p{ font-family:Arial,Helvetica,sans-serif; color:#333; font-weight:bold; }
HTML:
Melanie M. Hughes, PhD
Assistant Professor of Sociology