07-17-2008, 01:48 AM
|
#8 (permalink)
|
|
The Contributor
Join Date: Apr 2008
Posts: 78
Thanks: 0
|
I am still trying to get this to work. I've implemented the changes mentioned here, although I'm not sure I did them correctly. I've updated the code on the page so the result can be seen there and the code is below. It is better than the original, as far as the image moving is concered but the text is not included in the box now, the text moves up and down and the box around the image is missing the right side. I'm a novice at css, in case it isn't obvious, and I have put a lot of effort into getting this to work but I'm lost. Would someone please take another look and let me know where I have gone wrong?
HTML Code:
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
<html dir="ltr" lang="en">
<head>
<style type="text/css">
a imgA { border: 2px solid #fff; }
a:hover imgA { border: 2px solid #000; }
td.bgrolloverPlain img
{
border : 3px double #FFF;
}
td.bgrolloverPlain img:hover
{
border: 3px double #000;
}
a.bgrolloverPlain {
border: 3px double #fff;
text-decoration: none;
}
a.bgrolloverPlain:hover {
border: 3px double #000;
text-decoration: none;
}
</style>
</head>
<body>
<table border="0" width="100%" cellspacing="0" cellpadding="2">
<tr>
<td><table border="0" width="100%">
<tr>
<td class="bgrolloverPlain" align="center" width="33%" valign="top"><a class="bgrolloverPlain" href="http://domainname"><img class="imgA" src="imgb.jpg" width="250" border="0"><br>Classic Quality ( I1-I2 ) 14K<br>Gold Diamond Solitare Stud<br>Earring</a></td>
</tr>
</table></td>
<td><table border="0" width="100%">
<tr>
<td class="bgrolloverPlain" align="center" onMouseover="this.className='bgrollover'" onMouseout="this.className='bgrolloverPlain'"><a class="bgrolloverPlain" href="http://domainname"><img class="imgA" src="imgc.jpg" width="250" border="0"><br>Premium Quality ( Si1-Si2 )<br>14K Gold Diamond Solitare Stud<br>Earring</a></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
|
|
|
|