Thanks -Sharp eyes But the missing "." in both cases was a poor C&P effort by me. and interestingly noting should have worked - if the code was so flawed - I am increasingly amazed how browser development is progress in holding on to code when it ought to relinquish it - But that the future. As you will see the problem is solved but the mystery remains! Nice that you engaged in assessing my problem Thanks

Thanks for giving me some assistance. I have no idea why I had the problem but when I closed the browser cleared the cache and open it, it worked fine for me also. Clearing the Cache while open made no difference. Padding around the cells removes the issues you correctly identified on mouse over Thanks again

Yes. I think so? I have a number of tables on the one page and I only want the styling to apply to only one table. If i dont use the "class" option I found that it applies the styles to 'ALL' the tables Thanks you for taking the time to respond

The Situation I am displaying data from MYSQL database into a HTML table on a web page. I am using CSS to display alternative rows in different text size and background colours. I am using the 'hover' function to change background colours and text size The Problem The 'hover' function works perfectly for the 'odd; rows however for the 'even' rows it will change the text size but not the background colour My CSS code

table tbody tr:nth-child(odd) td {
background-color: lightblue;
}

.table tbody tr:nth-child(even) td {
background-color: lightgreen;
}
table tbody tr:hover td {
background-color: white;
transition: all .5s;
font-weight:normal;
font-size: 2.5em;
color: black;
border-right: 1px solid grey;
}

Solution: Can anyone spot the problem?