link mouseover
i am no expert in css, and need all the help i can get. i am making a menu. the menu is pretty simple, just a bunch of buttons in a row. so heres my predicament. i want to have rounded corners on the buttons, but i dont want the buttons to be graphics. my idea was to have a table with 1 <tr> and 3 <td>'s. in the first and third td i was planning on putting a graphic that had rounded corners on the top and bottom. in the middle td there would be the text for the link. i dont know how to tell it to change the pictures (to different colored pictures) on the two side columns when i mouseover the link. hope thats not too confusing. here is a simplified code
Code:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> a.menu:link, a.menu:visited, a.menu:active, a.menu:hover { background-color:#FF0000; display:block; } a.menu:hover { background-color:#0000FF; display:block; } a.menu2:link, a.menu2:visited, a.menu2:active, a.menu2:hover { background-color:#FFCC33; display:block; } a.menu2:hover { background-color:#993399; display:block; } </style> </head> <body> <table cellspacing="0px" cellpadding="0px"> <tr> <td><a class="menu" href="URL"> <table border="1" width="100px" height="100px"> <tr> <td></td> <td><center> LINK </center></td> <td></td> </tr> </table> </a></td> <td><a class="menu2" href="URL"> <table border="1" width="100px" height="100px"> <tr> <td></td> <td><center> LINK </center></td> <td></td> </tr> </table> </a></td> </tr> </table> </body> </html>
CSS Codes
Reply With Quote
Bookmarks