Cellpadding & Cellspacing: Here's How They Give Tables Breathing Room

Disclosure: Your support helps keep the site running! We earn a referral fee for some of the services we recommend on this page. Learn more

By default, table cells tend to be squeezed close to each other. To give your table cells a little more breathing room, use
CELLPADDING and
CELLSPACING.

illustration of CELLSPACING attributeCELLSPACING controls the space between table cells. Although there is no official default, browsers usually use a default of 2.


<TABLE BORDER>
<TABLE BORDER CELLSPACING=2>
<TABLE BORDER CELLSPACING=10>
peachescherries
walnutsalmonds
peachescherries
walnutsalmonds
peachescherries
walnutsalmonds

illustration of CELLPADDING attributeCELLPADDING sets the amount of space between the contents of the cell and the cell wall. The default is 1. CELLPADDING is usually more effective than CELLSPACING for spreading out the contents of the table.


<TABLE BORDER>
<TABLE BORDER CELLPADDING=1>
<TABLE BORDER CELLPADDING=10>
peachescherries
walnutsalmonds
peachescherries
walnutsalmonds
peachescherries
walnutsalmonds
Parent: 
Tables
Adam is a technical writer who specializes in developer documentation and tutorials.