[Top]
More advice for the full screen mode.
   
Sivut toimivat riittävän hyvin MS IE 4.0+, Opera 5.x+, Netscape 6.0+/ vast. Mozilla ja Konqueror 3.x selaimilla. Yleisesti ottaen sivut toimivat parhaiten uusimmilla Opera selaimilla. Sivujen toimivuus vanhemmissa selaimissa on heikko, erityisesti Netscape 4.x kohdalla.

I list below all topic groups, which I have done according to subjects, which they handle. You can return to this topic group by using this menu and the link Table of topic groups on the top of the each page.
 
 
Search:
[Help]

HTML 4.01 table elements

It is possible to apply all properties, which I have explained in previous pages like borders, background, text types (look at an example[S][Pw]). In principle for all HTML 4.0 table elements (TABLE, CAPTION, THEAD, TBODY, TFOOT, COL, COLGROUP, TH, TR and TD). I recommend however to define CSS only for TABLE, TH and TD elements because all browsers support only partially the HTML 4.0 table model.

Indeed you can use more layered background properties if you define more table element ([M][S][Pw] - there is small examples in in the bottom left of the next model).

W3C: CSS2: 17 Tables, 17.5.1 Table layers and transparency[Pw].

Most of the properties work in the element CAPTION. CSS2 offers to change the place of the caption with the caption-side property ([M][S][Pw]).

In tables cells are descendants of rows, never of columns. Nevertheless, some aspects of cells can be influenced by setting properties on columns by using so-called column What are selectors, classes and id-attributes. They are related to the element COL just after the element TABLE. Below is an example of usage of them ([M][S][Pw] - the model on the bottom right concerns column selectors):

*#col1 { border: 3px solid black;}
*#col2 { border: 3px solid red;}
*#col3 { border: 3px solid olive;}...
<TABLE>
<COL id="col1"><COL id="col2"><COL id="col3">...

There is also row What are selectors, classes and id-attributes. These can have also the first-child pseudo-class. Here is an example, which should give background and border properties for table rows ([M][S][Pw]):

tr:first-child {background-color: white; border-top: solid black 3px;}
tr {background-color: aqua; color:black; border:yellow 3px solid;}
*#row1 {border: 3px green solid; background-color:aqua;}
*#row2 {border: 3px solid green; background-color:white;}
*#row3 {border: 3px solid blue; background-color:lime;}
*#row4 {border: 3px solid blue; background-color:yellow;}
*#row5 {border: 3px solid blue; background-color:green;}

Browser-specific notes:

  1. Opera 3.x and Netscape 4.x support limited basic table elements (TABLE, TH and TD). For example CSS-borders don't work with these browsers.

  2. The element CAPTION works according to the HTML 4.0 specification only in Opera and Netscape browsers. MS IE handles it as if a special table cell. Different implementation makes the usage of this element problematic.

  3. the change of the place of the CAPTION element with CSS works only in Opera 4.x+ and Mozilla Gecko browsers ([M][S][Pw]). If the TFOOT element has been used Opera 4.x-6.x don't work correctly and implementations are messy (fixed in Opera 7.x).

  1. Supporting of COL seems to be quite limited. The model page ([M][S][Pw]), where on the bottom right concerns column selectors works correctly in Opera 4.x+ and Mozilla Gecko browsers but not in the MS IE versions, which I have tested.

  2. Opera didn't support in my tests padding for the COL element, but MS IE supported.

  3. The element COLGROUP has the most limited support. In my tests MS IE 5.x+ can center the text in a model document ([M][S][Pw]) and Mozilla 1.1 support border properties for it.

  4. Opera 4.x+ renders border colors of Model25a.html[S][Pw] as they have been defined. MS IE renders only background colors correctly except in the first row.

  5. Only Mozilla Gecko and Opera 7.x+ browsers render the :first-child pseudo-class in the previous model page.

[Top]