Week Two, Day Three - Space In Your Table

      So, you have a table, black border of 3px.

This is table data #1. This is table data #2.
This is table data #3. This is table data #4.



    See the fact that the table data borders have space between each other? You can control this. Go to the table tag, and type:
cellspacing="0"
Now it will be gone.

This is table data #1. This is table data #2.
This is table data #3. Look! No space!



    Yay!
    Text inside table cells can be treated just exactly like text outside of table cells. You can put P and BR and A href and images inside table cells.

    But see how it's all squished up next to the table wall? There's something you can do about it. Think of this like..... insulation in a house wall.
cellpadding="10"
This command is what it says: padding for a cell. (And I bet I didn't have to tell you that it went in the TABLE tag, did I? ^_^)

This is table data #1. This is table data #2.
This is table data #3. Look! Space!



    Now you can do all sorts of spiffy things to tables.

Border of 6 Bordercolor of 008080
cellspacing of 3. cellpadding of 20



Width of 70%, Border of 1 Bordercolor of 800080
cellspacing of 20. cellpadding of 3.



    Now, what if you wanted a blank table data, but didn't want a random hole in your table? If you leave a TD empty, the browser just sort of omits the whole cell.

This table....
... is misshapen.



    You can insert a command called the 'nonbreaking space' into the cells.
 

This table....  
  ... has 4 cells!



    "   " is a very useful command. You know that browsers ignore white space in your code? This   inserts    white     space      for       you. Nifty, isn't it? And "   " can be used outside of tables, too. That's how I have indents: use three "   "


So, fiddle around with all of this, because tomorrow the potential for confuzzion triples. ^_^
Week Two, Day Four: Manipulating Your Table.





This HTML Tutorial was created by Sanna for the edification of new HTML programmers. Please do not steal the text from this page and call it yours. Reproduction rights granted for educational purposes only! Be nice, y'all; you know right from wrong. August 10, 2002. Sanna@SannaSK.com
HTML 3-A-Day
Main Index
SannaSK.com
Hosted by CaravanMultimedia.com