CELLSPACING and CELLPADDING

Navigation

Sponsors

Save this to Del.icio.us

CELLSPACING and CELLPADDING

The appearance of a table can be changed in many ways. For example you can change the width, alignment, background color/image etc... CELLSPACING and CELLPADDING also aids in the the way the table is displayed. So what exactly do these 2 attributes define? Take a look at the diagram below:

The outermost thick grey line represents the table and the 2 rectangular boxes within this area represents the cells. CELLSPACING refers to the space between the edge of each cell and table, as well the the space between each cell - this is highlighted in light red in the diagram. CELLPADDING on the other hand refers to the space between the edge of each cell and it's content - represented by the blue area in the diagram above.

Defining these are simple and can be done by adding the 'cellspacing = "x"' and / or 'cellpadding = "x"', where x is the required measurement (e.g. 1px), within the <table> tag.

Here are a couple of more examples to make sure everything is crystal clear:

Cellspacing can in fact also be used to table borders - these usually look better than the default "BORDER" attribute.


[ Back to HTML Tutorials ]


Forums | Search | Donate | Links | Contact | Templates | Privacy Policy
Copyright © 2014 SiteToolCenter.com

Website Design

Best Viewed With Mozilla FireFox