I’m trying to format a table. In both Chrome and Firefox the style for the TR seems to be ignored when I load the file into the browser. I’m just trying to add a border to the row. The style for the table and the TD are used.
If I use the source in a fiddle it works.
for what it’s worth extracting the style to a separate css file didn’t help.
here’s the link to the fiddle. http://jsfiddle.net/kdubs/6Ppf4/
<!DOCTYPE html>
<html>
<style type="text/css">
table
{
border: 5px solid red;
}
tr
{
border: 3px solid green;
}
td
{
border: 1px solid blue;
}
</style>
<body>
<div>
<table>
<tbody>
<tr>
<td>
one
</td>
<td>
two
</td>
</tr>
<tr>
<td>
three
</td>
<td>
four
</td>
</tr>
<tr>
<td>
five
</td>
<td>
six
</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
If you run it in the JSFiddle without normalization it doesn’t work either – Not working
To fix it add
border-collapse: collapse;to your table – DEMO