Page 7 - LoudOffice_Guide-to-HTML_Part-II_Advanced.PDF
P. 7
Aligning the Contents of Cells and Rows
Alignment can be controlled for entire rows (within the < t r > tag) or individual cells (within
the < t d > tag). Both the a l i g n and v a l i g n attributes can be used to control horizontal
and vertical alignment respectively.
For example, the following HTML code produces the following table:
< t a b l e w i d t h = " 5 0 % " b o r d e r = " 2 " c e l l s p a c i n g = " 2 " c e l l p a d d i n g = " 2 "
h e i g h t = " 2 5 0 " >
< c a p t i o n > A S i m p l e T a b l e < / c a p t i o n >
< t r >
< t h > C o l u m n 1 < / t h >
< t h > C o l u m n 2 < / t h >
< / t r >
< t r >
< t d v a l i g n = " b o t t o m " a l i g n = " l e f t " > B o t t o m - L e f t A l i g n m e n t < / t d >
< t d v a l i g n = " t o p " a l i g n = " r i g h t " > T o p - R i g h t a l i g n m e n t . < / t d >
< / t r >
< t r v a l i g n = " m i d d l e " >
< t d a l i g n = " c e n t e r " > C e n t e r - M i d d l e A l i g n m e n t < / t d >
< t d a l i g n = " c e n t e r " v a l i g n = " b o t t o m " > B o t t o m - M i d d l e A l i g n m e n t < / t d >
< / t r >
< / t a b l e >
Merging Cells
Sometimes, you may wish to have a cell that spans across multiple rows or columns. For
example, you may want to display a table similar to the one below:
LoudOffice.com Guide to HTML – Part II Page 7