<table width="492" border="0" bordercolor="#202020" align="left" cellpadding="7" RULES=ROWS FRAME=HSIDES>

I have created a table with four rows and I use the code above to take away the vertical borders.

What I would like to do is to take away 2nd (out of 3 rows) row. How can I do this? Do I need to use CSS?

Thanks.

Recommended Answers

All 11 Replies

you want to do that 2nd row is enter the out of the third row then you can use this tag
<tr>

<tr>
please try to this tage if you can succse then please tellme

Ytregnn,

"take away"?

Best way is to serve the table without the row you don't want.

Airshow

Airshow: I do want the rows/borders, but I don't want every 2nd border to be visible.

Ex:
_______
_______
_______
_______
_______

Ex 2:
_______

_______

_______

Try using the colspan parameter, this merges the columns.

If you're generating the HMTL code yourself, add a class to the rows you want to style without borders.
E.G. HTML

<table width="492" border="0" bordercolor="#202020" align="left" cellpadding="7" RULES=ROWS FRAME=HSIDES><tbody>
<tr><td>1st row</td></tr>
<tr class="noborders"><td>2nd row</td></tr>
<tr><td>1st row</td></tr>
<tr class="noborders"><td>2nd row</td></tr>
</tbody></table>

and style the CSS accordingly.

.noborders td {border:0;}

urolicious:

I can see that the example you've created works, but somehow it doesn't work when I try to implement it in my own code. :S

Don't really know where it's all going wrong.

There's a problem with using "rules" to control a table's appearance - namely that the HTML specification doesn't specify what the appearance should be and each browser renders differently.

Depending on the visual effect you are after, you might be lucky and get an acceptable appearance in all borwsers but many people choose not to use table rules. It's generally safer (appearance-wise) to use a purely CSS solution for this sort of thing.

Here is a solution (certainly not the only one):

table.myTable {
	border : 1px solid #999999;
}

table.myTable td {
	background-color: #F4F4F4;
	border : 0px solid #999999;
}

table.myTable tr.underline td {
	border-bottom-width : 1px;
}
<table class="myTable" border="0" cellpadding="5" cellspacing="0">
<tr><td>aaa</td><td>aaa</td><td>aaa</td></tr>
<tr><td>bbb</td><td>bbb</td><td>bbb</td></tr>
<tr class="underline"><td>ccc</td><td>ccc</td><td>ccc</td></tr>

<tr><td>ddd</td><td>ddd</td><td>ddd</td></tr>
<tr><td>eee</td><td>eee</td><td>eee</td></tr>
<tr class="underline"><td>fff</td><td>fff</td><td>fff</td></tr>

<tr><td>ggg</td><td>ggg</td><td>ggg</td></tr>
<tr class="underline"><td>hhh</td><td>hhh</td><td>hhh</td></tr>

<tr class="underline"><td>iii</td><td>iii</td><td>iii</td></tr>

<tr><td>jjj</td><td>jjj</td><td>jjj</td></tr>
<tr><td>kkk</td><td>kkk</td><td>kkk</td></tr>
<tr><td>lll</td><td>lll</td><td>lll</td></tr>
</table>

Note that the very last table row does not need class="underline" as it is hard against the bottom edge of the table.

Airshow

im sorry.. you should collapse the table borders before any border property will work in css. so this is the css code you should have:

table {border-collapse: collapse;}
td {border:1px solid #000;}
.noborder td {border:0;}

I'm sure you're right URO. I tested quickly in IE6 which is not the most representative of browsers (to put it politely).

Airshow

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.