How do I.....

Convert the following into .css

[Daily Sparring]

I would like this to be test and not images. I am not too familiar with .css and am having trouble making this display properly.

<td valign="top" background="images/menuback.gif" height="20" align="right" ><A href=""
onmouseout="onoff('link1','off')"
onmouseover="onoff('link1','over')"><img src="images/link1off.gif" border="0" name="link1" alt="current mortgage rates"></a><img src="images/spacer.gif" border="0"><A href=""
onmouseout="onoff('link2','off')"
onmouseover="onoff('link2','over')"><img src="images/link2off.gif" border="0" name="link2" alt="link2"></a><img src="images/spacer.gif" border="0"><A href=""
onmouseout="onoff('link3','off')"
onmouseover="onoff('link3','over')"><img src="images/link3off.gif" border="0" name="link3" alt="link3"></a><img src="images/spacer.gif" border="0"><A href=""
onmouseout="onoff('link4','off')"
onmouseover="onoff('link4','over')"><img src="images/link4off.gif" border="0" name="link4" alt="link4"></a></td>
</tr>

Thank you in advance.

[timhisu]

It really depends on what those images contain. Are they just images of text? If so, you can use CSS to replace them.

[drbrain]

<div id="nav">
<a href="#">Mortgage Rates</a>
...
</div>

#nav :link { /* link styles */ }
#nav :visited { /* visited styles */ }
(if you want visited styles to match link styles, use #nav :link, #nav :visited)
#nav :link:hover, #nav :visited:hover { /* hover styles */ }
#nav :link:active, #nav :visited:active { /* active styles */ }

[Daily Sparring]

Thanks, that worked great. Only problem I have now is getting it to display in the middle (absmiddle apperently not supported) of my background image.

I also was wondering if I could include alt information, as I do with the images.

[drbrain]

You mean tooltips? Add a title attribute to your anchors:

<a href="" title="Tooltip stuff">...</a>