CSS: borders between table columns only
I know this is an old question, but there is a simple, one line solution which works consistently for Chrome, Firefox, etc., as well as IE8 and above (and, for the most part, works on IE7 too - see http://www.quirksmode.org/css/selectors/ for details):
table td + td { border-left:2px solid red; }
The output is something like this:
Col1 | Col2 | Col3
What is making this work is that you are defining a border only on table cells which are adjacent to another table cell. In other words, you're applying the CSS to all cells in a row except the first one.
By applying a left border to the second through the last child, it gives the appearance of the line being "between" the cells.
Edit 2
Erasmus has a better one-liner below
Not without tricky css selectors and extra markup and the like.
Something like this might do (using CSS selectors):
table {
border:none;
border-collapse: collapse;
}
table td {
border-left: 1px solid #000;
border-right: 1px solid #000;
}
table td:first-child {
border-left: none;
}
table td:last-child {
border-right: none;
}
Edit
To clarify @jeroen's comment blow, all you'd really need is:
table { border: none; border-collapse: collapse; }
table td { border-left: 1px solid #000; }
table td:first-child { border-left: none; }