Solved

How to Increase the Space Between the Columns but not the Rows in a HTML Table

Posted on 2014-02-07
2
6,713 Views
Last Modified: 2014-02-07
I have created the following table which holds a series of anchors that link to topics within the page:

<table border="0" cellspacing="1" cellpadding="2" align="center">
<tbody>
<tr>
<td><a style="font-size: xx-small;" href="http://www.saiprograms.com/john-cabot-university-syllabi-new#arthist">Art History and Studio Art</a></td>
<td><a style="font-size: xx-small;" href="http://www.saiprograms.com/john-cabot-university-syllabi-new#econsocsci">Economics and Social Sciences</a></td>
<td><a style="font-size: xx-small;" href="http://www.saiprograms.com/john-cabot-university-syllabi-new#mathsci">Mathematics</a></td>
</tr>
</tbody>
</table>

I would like to have more space between the columns, but not the rows. However, if I try to increase the cell spacing, the space between the rows also increase.

How can I just increase the column width only?
0
Comment
Question by:geeta_m9
2 Comments
 
LVL 8

Accepted Solution

by:
Adrian Crabtree earned 350 total points
ID: 39842516
Hi geeta_m9, you could try adding padding to the td. Here's a link to illustrate that idea.

http://jsfiddle.net/tB96H/1/
0
 

Author Closing Comment

by:geeta_m9
ID: 39842543
Thanks.
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Have you tried to learn about Unicode, UTF-8, and multibyte text encoding and all the articles are just too "academic" or too technical? This article aims to make the whole topic easy for just about anyone to understand.
Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

821 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question