Table format using CSS - boarder issue
Issues: CSS formatting HTML table more specifically table boarder issue.
problem: - If the mouse is moved out from the bottom of the table the boarders appear. - moving into the table from the bottom, does return things back not normal but I like it to remain constant.
works: - at refresh/reload table/css. format -> works - moving the mouse from the TOP and into the table, the format -> works. - moving round within the table the format -> works.
side note: when hovering over a TR record I have it set to display border-left-style:solid; to indicate current hover. ultimatly I like to change the entire record color with another color but for now I’ll like to keep the border-left-style:solid;
echo '<table id="tableExample">
<tr>
<th> Incident </th>
<th> Title </th>
<th> Level </th>
</tr> ';
foreach($testRes as $value1)
{ if($value1['inc_level'] == 2) { $level = "background-color: #3090C7;"; }
elseif($value1['inc_level'] == 3) {$level = "background-color: #FFA0A0;"; }
else { $level = "background-color: #DEDEDE; "; }
echo "<tr style='". $level . "'> <td>". $value1['inc_index'] . "</td> <td>" . $value1['inc_title'] . "</td> <td>". $value1['inc_level'] . "</td> </tr>"; }
* Table CSS */
#tableExample { border-collapse:collapse; border-style:none; }
#tableExample th {background-color: #fff; border-left-style:solid; border-color: #fff;}
#tableExample tr { }
#tableExample tr:hover { cursor: default; background-color: #ccc; border-left-style:solid; }
a.tablelink:link { color: black; text-decoration:none; }
a.tablelink:hover { color: black; text-decoration:none; }
a.tablelink:active { color: black; text-decoration:none; }
a.tablelink:visited { color: black; text-decoration:none; }