web space | free hosting | Business Hosting Services | Free Website Submission | shopping cart | php hosting
Free Web tutorials covering HTML, CSS, JavaScript, and DHTML from beginner to advanced. Free downloads and developer resources. Personalized help via email, form, and chat. free, web, tutorials, HTML, html, CSS, css, stylesheet, cascading stylesheet, Javascript, javascript, JavaScript, DHTML, dhtml, beginner, advanced, web development, web page, web site, free web tutorial, free HTML tutorial, free CSS tutorial, free css tutorial, free cascading stylesheet tutorial, free stylesheet tutorial, free javascript tutorial, free DHTML tutorial, free HTML class, free CSS class, free stylesheet class, free cascading stylesheet class, free javascript class, free DHTML class

Home <Code_Punk>'s Web Tutorials
Beginning HTML
Beginning CSS
Advanced HTML
Advanced CSS
Beginning JavaScript
Advanced JavaScript
DHTML
Website Development and Management
Downloads & Resources
HELP!!
Forum
Participate
E-Mail <Code Punk>

Tables:
Final Exam


Make the tables below using the available directions. Remember that cells/columns and rows will size themselves equally across or up and down a table if no WIDTH and HEIGHT is used. Other dimensions will require using these attributes. If your table looks like the example, but shorter, or "squatter", try adding a HEIGHT to the overall table.

Your Starter For...

This simple table is 90% as wide as the page and 200 pixels high. It is centered. The center column cells are 50% the width of the overall table.

Cell #1 Cell #2 Cell #3
Cell #4 Cell #5 Cell #6


Checkerboard

Make the table below which is a black and white 8x8 checkerboard. Remember that you won't need to use WIDTH or HEIGHT in the <td> tags because you want all the cells to be the same size. The board below is 200x200 pixels and a <br> tag is used in each cell for "stub" data.

HINT: Copy and paste comes in really handy here.



































































A Little Spanning

This table is 70% across the screen and 250 pixels high.

Cell #1 Cell #2 Cell #3
Cell #4 Cell #5


More Spanning

A more complex table. It's dimensions are 70% wide and 200 pixels high.

Cell #1
Cell #2 Cell #3 Cell #4
Cell #5 Cell #6


Nesting

This one will take a little time to figure out. The three tables are nested inside a layout table. They are spaced by using CELLSPACING in the layout (parent) table. Hint: The bottom row of the layout table is spanned. You could more easily use table "stacking" if the layout table's borders were turned off (BORDER=0).

Cell #1 Cell #2
Cell #3
Cell #1 Cell #2
Cell #3
Cell #1 Cell #2
Cell #3




Continue To Lesson 37 -- Simple Tabular Formatting >>>

<<< Back To Advanced HTML Index




<Code_Punk>'s Web Tutorials