Page 1   Page 2   Page 3   Page 4   Page 5   Page 6  

Creating more table cells.

Next we will create a partner for our lonely cell, it will be a Copy and Paste affair. Please do yourself a favor and utilize this trick, or you will be typing a lot of code. When you type from scratch, you run the risk of making mistakes, and the code may not work.

Place your cursor after the closing row and hit the [Enter] key. Copy the line of code and paste it below, close up any unwanted space with either the [Backspace] or [Delete] keys. Does your code look like Figure 3? Remember to Save the change and then Reload or Refresh the browser.

Figure 3 Adding a Cell to our Table.

Figure 4 Displaying two Data Cells.

It’s time to see what this table will look like with another Column and then with another row. First I’ll copy and paste another data cell, and then I’ll copy and paste a whole Row. To create another cell on the same row, just repeat the procedure you used to create the second cell. To create a whole additional row, copy every thing from the through the and paste it below, but before the closing tag. You can see the new code in Figure 5 to adjust yours. Be sure it looks like mine before going on to any new work.

Figure 5 Duplicating the Table Row.

Figure 6 Showing the two Table Rows.

I think it’s pretty apparent that I’ve used Copy and Paste here. The double-sided flags have been duplicated.

In the next version of this page we will replace the words inside the double-sided flags. You will notice that the Table cells shrink or grow to fit the data inside. This little trick can be a nuisance sometimes, so I’ll teach you some tricks to overcome this feature very soon.

Notice in Figure 6 how the Table is doing something we call Word Wrapping. When there isn’t enough room on one line to finish the sentence, it moves to another line below, just as a Word Processor would.

On the next page we’ll make some changes to the Table and learn more about Word Wrapping.

Page 1   Page 2   Page 3   Page 4   Page 5   Page 6   TOP

Back to LAB     Back to TOC