How Do I Add A Border To My Table With CSS?

How do I add a border to the table on this page:
<!-- m --><a class="postlink" href="http://www.gamexplain.com/test3.shtml">http://www.gamexplain.com/test3.shtml</a><!-- m -->

What I want is a border that lines the left and right sides of each cell, but not the top or bottom. I'm pretty sure I've read that this can be done, but I'm not sure how.

Here's a picture of what I want it to look like:
<!-- m --><a class="postlink" href="http://www.gamexplain.com/tablesample.jpg">http://www.gamexplain.com/tablesample.jpg</a><!-- m -->

Thanks!table {border:1px solid #000;}
or
<table style="border:1px solid #000; width:289px;" cellpadding="0" cellspacing="0" summary="">

See this thread (<!-- m --><a class="postlink" href="http://www.webdeveloper.com/forum/showthread.php?s=&threadid=52022">http://www.webdeveloper.com/forum/showt ... adid=52022</a><!-- m -->)What you need to do is put the following in your .css page

.leftandrightborder {
border-left: 1px solid black;
border-right: 1px solid black;
}

Then put this in the cell tag (<td>) that you want to have the style

it looks like this:

<td class="leftandrightborder"></td>

if you want your table to have the left/right border then put the class="leftandrightborder" in the table tag (<table>) that you want to change.

Fangs way (above) would not let you change it in your .css page but in your .html page

Hope this helps.

EdOriginally posted by Fang
table {border:1px solid #000;}
or
<table style="border:1px solid #000; width:289px;" cellpadding="0" cellspacing="0" summary="">

See this thread (<!-- m --><a class="postlink" href="http://www.webdeveloper.com/forum/showthread.php?s=&threadid=52022">http://www.webdeveloper.com/forum/showt ... adid=52022</a><!-- m -->)

This worked great. Just one more thing, can I change the border's color?

Thanks!Change the "#000" to any desired hex value ("#369" is equivalent to "#336699" and either format may be used) or use one of the CSS color keywords (<!-- m --><a class="postlink" href="http://www.w3.org/TR/CSS21/syndata.html#color-units">http://www.w3.org/TR/CSS21/syndata.html#color-units</a><!-- m -->).Originally posted by NogDog
Change the "#000" to any desired hex value ("#369" is equivalent to "#336699" and either format may be used) or use one of the CSS color keywords (<!-- m --><a class="postlink" href="http://www.w3.org/TR/CSS21/syndata.html#color-units">http://www.w3.org/TR/CSS21/syndata.html#color-units</a><!-- m -->).

Ok, great, that's kind of what I thought, the three digits just threw me off.

Thanks very much.
 
Back
Top