I have a little trouble with changing one tr
border color
My table is something like this
<table>
<div id="one">
<tr>
<td></td>
<td></td>
</tr>
</div>
<div id="two">
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</div>
</table>
I would like first <tr><td></td><td></td></tr>
to be white and the second one to be blue
I have tried with
#one td, #one tr,#onetable{
border: 1px solid white;
border-color:#ff0000;
But it didn't work Any idea Ty
BORDERCOLOR = color expression. BORDERCOLORLIGHT = color expression. BORDERCOLORDARK = color expression. BORDERCOLORLIGHT sets the color of the upper and left corners of the cell.
you should give the border to the rows and the td that are first child, then apply different color for the border of the highlited tr. Show activity on this post. In order to fix this give your tr a display property of block . See the code snippet below.
To create table border in HTML, the border attribute was used. But the introduction of HTML5, deprecated the border tag. Create table border using the CSS property border. Set table border as well as border for <th> and <td>.
<style type="text/css">
table {
border-collapse: collapse;
}
#one td {
border: 1px solid #ff0000;
}
</style>
<table>
<tr id="one">
<td></td>
<td></td>
</tr>
<tr id="two">
<td></td>
<td></td>
</tr>
</table>
Here you go
<html>
<head>
<style>
body {background-color: beige;}
table {border-collapse: separate;}
table td { width: 50px; height: 50px;}
table tr:first-child td {border: 1px solid #fff; }
table tr:last-child td {border: 1px solid #0000FF; }
</style>
</head>
<body>
<table>
<tr>
<td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td>
</tr>
</table>
</body>
</html>
and a fiddle
(btw #0000FF
is blue)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With