Forum Moderators: not2easy
This is the html:
<div id="links-a">
<a href="http://www.example.com/" target="_blank" class="link-a"><p class="roll">Link Text on hover</p><img src="Images/links/link1.png" alt="alt text" class="link"></a>
<a href="http://www.example.com/" target="_blank" class="link-a"><p class="roll">Link Text on hover</p><img src="Images/links/link1.png" alt="alt text" class="link"></a></div>
CSS
div#intro a {
text-decoration: none;
}
div#intro a p.roll {
font: 95%/125% Arial, Sans Serif;
letter-spacing: 112%;
display: none;
width: 64px;
height: 49px;
background-color: #333333;
z-index: 100;
margin-top: 2px;
color: #FFFFFF;
padding: 20px 5px 5px 5px;
text-align: center;
opacity: .75;
position: absolute;
}
div#intro a p.roll span {
font-weight: bold;
}
div#intro a:hover p.roll {
display: inline;
}
everything works great in the browsers i need, firefox newest IEs and safari. but it isn't valid because of the p tag. how should i have done this better?
Thanks!
[edited by: swa66 at 6:55 pm (utc) on April 27, 2009]
[edit reason] use example.com, it can't be owned [/edit]
