|
Long Rows and Columns
You can make some cells larger than others to cover more
than one row with ROWSPAN=height-in-rows. A long cell that stretches
three rows down should have ROWSPAN=3 in its <TD> tag. You
also must have three rows for the cell to stretch down that far;
otherwise, it will stop at the last row if there are fewer rows in
the design.
The first row of the table will contain the long left column cell
and the cell with the first topic of the right column. The
second row will contain only the cell with the second topic
of the right column, since the left cell will stretch down to fill
the space in the left side. The third row will contain only
the cell with the third topic of the right column, since the left
cell will stretch down to fill the space in the left side there, too.
Let's replace those <p><hr><p> tags
separating the right column topics by
</td></tr><tr><td> tags to
make three cells in three rows and add ROWSPAN=3 to the <td>
tag for the left column. I'll add bgcolor="#CCFFCC" to the
<td> tag for the Crafting Tip topic to give it a light green
background, bgcolor="#FFCCCC" to the Quote of the Feast topic <td>
tag to give it a light pink background, and bgcolor="#CCCCFF" to the
Most Original Christmas Present topic <td> tag to give it a
light blue background. I'll also need to remember to add
<font> and </font> tags to surround the text in each cell.
|
Louella's Tattle and Tips
Ruthann gets arrested!
Ruthann got into big trouble this year! She was building up her usual
head of Christmas cheer right on schedule for the feast, when her cheap
husband Sam decided to save a few pennies by buying presents from
unorthodox sources.
Ruthann started making her fancy fruitcakes for Christmas presents and
soaking them in extra rum as usual. The smell soon brought their cat
Fluffy to investigate. What happened next isn't clear. Sam claims
that the cat knocked a cake off the counter next to the floor heater.
Ruthann suspects it was Sam getting an early start on his cake.
Whoever was responsible for it, the flaming fruitcake set off the
kitchen fire alarm and brought the neighbors and the volunteer
fire department on the run. The police naturally showed up to
investigate the commotion. When a neighbor opened the broom closet
to help clean up the mess, a police officer saw (continued on page 2)
|
Crafting Tip
Got a lot of green tomatoes snatched off the vine before frost hit?
Cover them with a festive assortment of left-over house paint and heap
them high in a pretty bowl like Christmas ornaments. Eat your heart
out, Martha!
|
|
Quote of the Feast
The biggest turkeys do their gobbling on Christmas.
Said by Grandma Willa to Uncle Roy after he spilled giblet gravy on
her best crocheted tablecloth. He's rightly ashamed of himself.
|
|
Most Original Christmas Present
Little Will's giant windchimes, made from recycled CD's which proved to
have some naughty pictures on them. His mother is discreetly
investigating the source of his creativity.
|
Similarly, you can make a wide cell that covers more than one cell
space in the row with COLSPAN=width-in-cells. A cell that is four
"regular" cells wide should have COLSPAN=4 in its <TD> tag.
You need to be sure that the WIDTH and spacer graphic are set wide
enough for this cell if there aren't four cells above or below it for
the browser to use as a reference to set the size of this "oversized"
cell as you work on your table. Tip: If you use "oversized" cells
in your puzzle and display your puzzle before you have filled in all
the small cells to use that space in another row or column, the
browser may stretch the cells to fill the space. Just complete the
puzzle with the rest of the cells to stop this.
The line "Louella's Tattle and Tips" is the title of
the whole newsletter, not just the left column. It would look
better centered over both columns in a wide cell across the top.
Let's make a new row with a cell for the title and move it there.
We can center it with <center> </center> tags. The
code looks like this:
<tr>
<td colspan=2>
<font face="Arial" size=3>
<center>Louella's Tattle and Tips</center>
</font>
</td>
</tr>
|
Louella's Tattle and Tips
|
|
Ruthann gets arrested!
Ruthann got into big trouble this year! She was building up her usual
head of Christmas cheer right on schedule for the feast, when her cheap
husband Sam decided to save a few pennies by buying presents from
unorthodox sources.
Ruthann started making her fancy fruitcakes for Christmas presents and
soaking them in extra rum as usual. The smell soon brought their cat
Fluffy to investigate. What happened next isn't clear. Sam claims
that the cat knocked a cake off the counter next to the floor heater.
Ruthann suspects it was Sam getting an early start on his cake.
Whoever was responsible for it, the flaming fruitcake set off the
kitchen fire alarm and brought the neighbors and the volunteer
fire department on the run. The police naturally showed up to
investigate the commotion. When a neighbor opened the broom closet
to help clean up the mess, a police officer saw (continued on page 2)
|
Crafting Tip
Got a lot of green tomatoes snatched off the vine before frost hit?
Cover them with a festive assortment of left-over house paint and heap
them high in a pretty bowl like Christmas ornaments. Eat your heart
out, Martha!
|
|
Quote of the Feast
The biggest turkeys do their gobbling on Christmas.
Said by Grandma Willa to Uncle Roy after he spilled giblet gravy on
her best crocheted tablecloth. He's rightly ashamed of himself.
|
|
Most Original Christmas Present
Little Will's giant windchimes, made from recycled CD's which proved to
have some naughty pictures on them. His mother is discreetly
investigating the source of his creativity.
|
Finally, titles are usually bigger than the text that follows and
often in bold (extra dark) type. You can use a <th> tag
instead of the <td> to automatically use bold type. If you
want to change the size as well as using bold type, you can use
<h1> </h1> through <h5> </h5> tags to
surround your title. These header tags go from the largest font
size in <h1> to the smallest in <h5>. An <h1>
tag to an <h3> tag is good for the main title for the page
with subheadings a size or two smaller. Let's use <h3> for
the newsletter title and <h5> for the subheadings and center
the subheadings as well.
Louella's Tattle and Tips
|
Ruthann gets arrested!
Ruthann got into big trouble this year! She was building up her usual
head of Christmas cheer right on schedule for the feast, when her cheap
husband Sam decided to save a few pennies by buying presents from
unorthodox sources.
Ruthann started making her fancy fruitcakes for Christmas presents and
soaking them in extra rum as usual. The smell soon brought their cat
Fluffy to investigate. What happened next isn't clear. Sam claims
that the cat knocked a cake off the counter next to the floor heater.
Ruthann suspects it was Sam getting an early start on his cake.
Whoever was responsible for it, the flaming fruitcake set off the
kitchen fire alarm and brought the neighbors and the volunteer
fire department on the run. The police naturally showed up to
investigate the commotion. When a neighbor opened the broom closet
to help clean up the mess, a police officer saw (continued on page 2)
|
Crafting Tip
Got a lot of green tomatoes snatched off the vine before frost hit?
Cover them with a festive assortment of left-over house paint and heap
them high in a pretty bowl like Christmas ornaments. Eat your heart
out, Martha!
|
Quote of the Feast
The biggest turkeys do their gobbling on Christmas.
Said by Grandma Willa to Uncle Roy after he spilled giblet gravy on
her best crocheted tablecloth. He's rightly ashamed of himself.
|
Most Original Christmas Present
Little Will's giant windchimes, made from recycled CD's which proved to
have some naughty pictures on them. His mother is discreetly
investigating the source of his creativity.
|
Here's the code for our newsletter so far. Study the changes I've
described above.
<table width=100% border=1 cellpadding=10>
<tr>
<td colspan=2>
<font face="Arial" size=3>
<center><h3>Louella's Tattle and Tips</h3></center>
</font>
</td>
</tr>
<tr>
<td rowspan=3>
<font face="Arial" size=3>
<center><h5>Ruthann gets arrested!</h5></center>
<p>
Ruthann got into big trouble this year! She was building up her usual
head of Christmas cheer right on schedule for the feast, when her cheap
husband Sam decided to save a few pennies by buying presents from
unorthodox sources.
<p>
Ruthann started making her fancy fruitcakes for Christmas presents and
soaking them in extra rum as usual. The smell soon brought their cat
Fluffy to investigate. What happened next isn't clear. Sam claims
that the cat knocked a cake off the counter next to the floor heater.
Ruthann suspects it was Sam getting an early start on his cake.
<p>
Whoever was responsible for it, the flaming fruitcake set off the
kitchen fire alarm and brought the neighbors and the volunteer
fire department on the run. The police naturally showed up to
investigate the commotion. When a neighbor opened the broom closet
to help clean up the mess, a police officer saw (continued on page 2)
<p></font>
</td>
<td bgcolor="#CCFFCC">
<font face="Arial" size=3>
<center><h5>Crafting Tip</h5></center>
<p>
Got a lot of green tomatoes snatched off the vine before frost hit?
Cover them with a festive assortment of left-over house paint and heap
them high in a pretty bowl like Christmas ornaments. Eat your heart
out, Martha!</font>
</td>
</tr>
<tr>
<td bgcolor="#FFCCCC">
<font face="Arial" size=3>
<center><h5>Quote of the Feast</h5></center>
<p>
The biggest turkeys do their gobbling on Christmas.
<p>
Said by Grandma Willa to Uncle Roy after he spilled giblet gravy on
her best crocheted tablecloth. He's rightly ashamed of himself.</font>
</td>
</tr>
<tr>
<td bgcolor="#CCCCFF">
<font face="Arial" size=3>
<center><h5>Most Original Christmas Present</h5></center>
<p>
Little Will's giant windchimes, made from recycled CD's which proved to
have some naughty pictures on them. His mother is discreetly
investigating the source of his creativity.</font>
</td>
</tr>
</table>
Let's add a few pictures to finish up the newsletter in our next
chapter, Adding Images.
HTML Puzzles
Last update: August 12, 2001
|