ansaurus

Question

Answer 1

+3 A:

The border doesn't belong to the cells, rather it belongs to the table and is displayed between the cells. Hiding the row will hide the cells but not remove them, so the border between the cells is still there.

Tables are not intended to be used that way, if you hide parts of a table it will behave erratically or unexpectedly. The table structure doesn't change when you hide elements, so the table will not display as if the hidden elements didn't exist. If you want to remove table rows from the table you have to actually remove the tr elements from the table.

Guffa 2010-01-04 13:01:36

Answer 2

+1 A:

I've tried to reproduce this with the following code:

<html>
<style>
td { border: 1px solid black; }
</style>
<body>
<table>
    <tr id="row1"><td>Row 1</td></tr>
    <tr id="row2"><td>Row 2</td></tr>
    <tr id="row3"><td>Row 3</td></tr>
</table>
<p>Hide row 2</p>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"&gt;&lt;/script&gt;
<script>
$(function(){
    $('p').click(function(){$('#row2').hide();});
});
</script>
</body>
</html>

The borders are hidden along with the td element contents.

James Kolpack 2010-01-04 13:12:23

You're hiding all the rows, not a subset of them. If I hide all of the rows, that is fine.

Kezzer 2010-01-04 14:12:30

I've added more rows and hid only one of them - borders are still being hidden along with row contents.

James Kolpack 2010-01-04 14:16:33

Check my edit, I've found out why.

Kezzer 2010-01-04 14:26:44

ansaurus

tags:

views:

answers:

Hiding TR's - Borders Being Included

related questions