Book HomeCascading Style Sheets: The Definitive GuideSearch this book Saturday 01st of October 2016 03:25:38 AM

10.7. Tables

Perhaps as a result of a generic need to be able to describe table layout -- something CSS1 lacks -- CSS2 includes a handful of features that apply directly to tables and table cells. First, there are 10 new table-related values for display:


While the effects of most of these are obvious from their names, at least two may not be familiar to you. table-header-group and table-footer-group are used to mark the header and footer of a table. These are displayed, respectively, above or below all the rows of the table, but not outside of the table's caption.

Another interesting effect is that you can align text on a character by using the text-align property. For example, if you wanted to line up a column of figures on a decimal point, you might declare:

TD { text-align: "." }

As long as a set of cells are grouped into a column, their content will be aligned so that the periods all line up along a vertical axis.

Far from relying on existing properties, CSS2 provides a whole array of brand-new properties in the table section. Here are a few of them:

There are also properties describing how visibility and vertical-align are applied to tables. There is also a caption-side property, which functions exactly the same as the ALIGN attribute on the <CAPTION> tag, and the property speak-header-cell, which controls how header cells are handled by speech-generating browsers (more on that later).

Library Navigation Links

Copyright © 2002 O'Reilly & Associates. All rights reserved.

In the following paragraphs, I will highlight some of the most basic and important advantages that XML and Java provide to almost any system that uses them properly. This is by no means a comprehensive list of benefits, but items in this list should appear across just about any use of XML and Java technologies.

I will take a break from my normal pragmatic approach to getting you (the programmer) started with using XML and Java and just talk about the high level (design level) benefits of this wonderful combination. A good design is important to a good implementation for any system.

XML is structured

When you create your data using an XML editor (that you can write), you can not only input the content of your data, but also define the structural relationships that exist inside your data. By allowing you to define your own tags and create the proper structural relationships in your information (with a DTD), you can use any XML parser to check the validity and integrity of the data stored in your XML documents. This makes it very easy to validate the structure and content of your information when you use XML. Without XML, you could also provide this validation feature at the expense of developing the code to this yourself. XML is a great time saver because most of the features that are available in XML are used by most programmers when working on most projects.

By using XML and Java, you can quickly create and use information that is properly structured and valid. By using (or creating) DTDs and storing your information in XML documents, you have a cross-platform and language independent data validation mechanism (for free) in all your projects!


[ thin | medium | thick | <length> ]{1,4}

There are four ways to assign a width to a border: you can give it a length value such as 4px or 0.1em or use one of threeThis will leave us with the following:

<TD>navigation bar and main display</TD>

We'll turn to the sidebar first. Each set of links is grouped into a list under a main heading; these headings look different from
Basic Text Formatting

Now it's time to introduce the HTML tags used in the <BODY> section to format your page content.  In-line tags are meant to affect short bits of text; block-level tags affect paragraphs or other blocks of text, and typically include automatic line-breaks.  You can nest in-line tags within block-level tags and/or other in-line tags, but don't next block-level tags inside in-line tags.  Where tags let you specify attributes, attribute choices are summarized
  element, and the right padding to the end of it; padding is not applied to the right and left side of each line.

Now let's talk about top and bottom padding. In theory, an inline element with a background color and padding could have the background extend above and below the element. Figure 7-61 gives us some idea of what that might look like. The line height isn't changed, of course, but since padding does extend the background, it should be visible, right?