can any one write me a class which can be applied to a table and will change the outer borders of that table only I want to create a box around my contents in a web page. Setting border="1" set border of cells as well. I don't want to use inner table just want a CSS solution. Something like this

PART OF MY PAGE.. MAY CONTAINS TABLE AND OTHERS
CLASS APPLIED ABOVE SHOULD HAVE NO EFFECT HERE
Of course BORDER WILL COLLAPSE IN ACTUAL HTML
__________________________________________________ ________
| |
| |
| |
| |
| |
| |
| |
| | |_________________________________________________ _______|

If you apply the style to the table rather than the rows or cells, you'll get a border around the table only. Try this for the CSS style:

Code:

---

<style type="text/css">
    .bordered-table
  {
        border: 1px solid;
  }
</style>

---

And here's an example of applying it to a table:

Code:

---

<table class='bordered-table'>
<tr><td>one</td><td>two</td><td>three</td></tr>
<tr><td>1</td><td>2</td><td>3</td></tr>
</table>

---