CodingForums.com

CodingForums.com (http://www.codingforums.com/index.php)
-   HTML & CSS (http://www.codingforums.com/forumdisplay.php?f=13)
-   -   Table help with rollover (http://www.codingforums.com/showthread.php?t=244464)

kimmi_baby 11-23-2011 02:06 AM

Table help with rollover
 
Hi,
I just need some help with tables.

I'm using the tables for a mini menu. My problem is, on rollover, it doesn't actually cover the whole element. Is there a way for it to cover it all? The box is normally grey and on rollover, it's red but it still has a grey border. I need it all to be red. Any help would be greatly appreciated.

Here's the code

Code:

<table>

<tr class="heading">
<td><font color="#CCCCCC"><b>Commercial Cleaning:</b></font></td>
<td></td>
<td><font color="#CCCCCC"><b>Additional Services:</b></font></td>
</tr>

<tr>
<td><a href="corporate.php" title="corporate/office">Corporate/Office</a></td>
<td><a href="medicaloffices.php" title="Medical Offices">Medical Offices</a></td>
</tr>

<tr>
<td><a href="shoppingcentres.php" title="Shopping Centres">Shopping Centres</a></td>
<td><a href="educationcentres.php" title="Education Centres">Education Centres</a></td>
</tr>

<tr>
<td><a href="industrial.php" title="Industrial/Warehouse">Industrial/Warehouse</a></td>
<td><a href="exit.php" title="Exit/End of Lease">Exit/End of Lease</a></td>
</tr>

<tr>
<td><a href="construction.php" title="Construction/Buildings">Construction/Buildings</a></td>
<td><a href="eventcleaning.php" title="Event Cleaning">Event Cleaning</a></td>
</tr>

</table>
</div>

<div id="services2">

<table>
<tr>
<td><a href="windowcleaning.php" title="Window Cleaning">Window Cleaning</a></td>
<td><a href="blindcleaning.php" title="Blind Cleaning">Blind Cleaning</a></td>
</tr>

<tr>
<td><a href="carpetcleaning.php" title="Carpet Cleaning">Carpet Cleaning</a></td>
<td><a href="teatowelsupply.php" title="Tea-towel Supply Services">Tea-towel Supply Service</a></td>
</tr>

<tr>
<td><a href="pressurecleaning.php" title="Pressure Cleaning">Pressure Cleaning</a></td>
<td><a href="washroomsupplies.php" title="Washroom Supplies Service">Washroom Supplies Service</a></td>
</tr>

<tr>
<td><a href="hardfloorcare.php" title="Hard Floor Care">Hard Floor Care</a></td>
<td><a href="recycling.php" title="Recycling"><i>Recycling - COMING SOON</i></a></td>
</tr>

</table>


CSS
Code:

#services {
float:left;
padding-left:20px;
font-size:11pt;
       
       
}

#services2 {
float:right;       
padding-left:20px;
font-size:11pt;
margin-right:340px;
margin-top:-154px;
}


table a {
        display:block;
       
       
}
table a:hover {
color: white;
background-color: red;
}

td {
background-color:#CCC;
padding:5px;
padding-right:5px;

}


table {
border-spacing:5px;
}

tr.heading td {
background:white;       
       
}


mnkhaki 11-23-2011 11:00 AM

Hi Kimmi - what if you dd the border value to the a:hover, in addition to the color and background color that you already have?

Code:

table a:hover {
color: white;
background-color: red;
border:yourcolorvalue;
}

I'm new but I hope that should work...


All times are GMT +1. The time now is 06:35 AM.

Powered by vBulletin®
Copyright ©2000 - 2013, Jelsoft Enterprises Ltd.