Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Jun 2010
    Posts
    46
    Thanks
    10
    Thanked 0 Times in 0 Posts

    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;	
    	
    }

  • #2
    New Coder
    Join Date
    Oct 2011
    Posts
    44
    Thanks
    7
    Thanked 0 Times in 0 Posts
    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...


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •