How can I incorporate CSS transitions into my holiday list? When hovering over an image, I want it to display a larger size and then return to normal when the mouse is moved off. I understand how to do this with JavaScript, but I prefer to achieve this effect using CSS3. http://jsfiddle.net/TwRTc/
<html>
<head>
<style>
# select
{
transition:width 2s;
-moz-transition:width 2s; /* Firefox 4 */
-webkit-transition:width 2s; /* Safari and Chrome */
-o-transition:width 2s; /* Opera */
}
</style>
</head>
<body>
<table border="0" cellpadding="0" cellspacing="15" style="font-family:Comic Sans MS; color:#0066CC;">
<tr align="left">
<TH></TH>
<th>HOLIDAYS </th>
<th>DAYS OBSERVED</th>
</tr>
<tr>
<td><img class="select" src="C:/Documents and Settings/user/Desktop/new year1.jpg" width="25" height="25" border="1"> </td>
<td> NEW YEARS DAY </td>
<td>JANUARY 01, 2012</td>
</tr>
...Continues...
</tr>
</table>
</body>
</html>