HTML5, CSS3, and JavaScript Fourth Edition

(Ben Green) #1

CHAPTER 16. TABLES 164


The result would be rendered something like this:


Left Header Middle Header Right Header
Upper Left Upper Middle Upper Right
Middle Left Middle Middle Middle Right
Lower Left Lower Middle Lower Right

16.2 Past Abuses


You can put almost anything into a cell, including another entire table. The
cells are lined up nicely which makes it tempting to use them for the layout
of non-tabular material.


In fact, tables have been grossly abused in the past as a mechanism for
controlling thelayoutof webpages. If we go back to some old-timey tuto-
rials, we will learn more than we should about using tables to position the
graphical elements of webpages.


Exam Question 295 (p.353): Should tables be used for the layout of
non-tabular material?
Required Answer:no


The problem is that such layout is brittle. It does not slide gently into the
future as screen resolutions and dimensions change.


The solution is to use things like float and clear for the positioning of web-
page elements, and to restrict the use of tables to things that really are
tabular.


Avoid using tables as devices for positioning non-tabular content.


16.3 Cell Styling


Most of the styling is pretty obvious.


text-align:is used to modify the natural alignment of table elements.
elements are naturally left aligned.elements are naturally centered and
bolded.


color:is used to color the lettering that appears in a cell.


background-color: is used to color the background that appears behind
the lettering in a cell.

Free download pdf