CSS - Some Desirable Features


Featuring: CSS-Features not yet implemented
Credit: Imagenation

In this CSS tutorial page we examine some of the desirable features of CSS which have been specified but not yet implemented uniformly across all browsers. In a revrsal of form - the biggest laggard is Microsoft's Internet Explorer. Media Type - One of the biggest problems in Web Design is adapting the same HTML for different devices. One approach is to have the HTML pass through filtering software supplied by AvantGo or other vendors. But this requires that pages be prepared with special markup. Another option is to write directly to the device using some special protocol such as J2ME or WAP and bypass HTML altogether. A third alternative is to use CSS2 extensions. the following is a list of some of those extensions:

braille - blind accessible stylesheets
aural - audio and speech oriented style extensions
handheld - PDA and small screen device oriented stylings
print - printer output specific stylings
projection - projector/large screen specific stylings
screen - the normal default, a computer screen
tty - teletype or other line by line device
tv - television screen (with a roaring debate on how to specify screen characteristics)
In addition, CSS2 allows for an @import "cssfile.css" tv,projection; media-scope command that imports a different stylesheet depending on what media is being used. Finally, @media tty, handheld { p {font-size: 8pt; color: red;} sets the paragraph output to teletype and handheld-like devices to be a very small 8pt font using red text. In sum, it would be very useful to have these device aware stylings available for web page creation as an attractive alternative to the current options.

Universal selector- the following style, * { font-family: arial, sans-serif; color: blue;}, applies this style to all HTML tags in a document or group of web pages depending on where it is used. Obviously, this is a very convenient method to establish a general look and feel to a web page or website.

Adjacent selector- the following style, td + p {font-size: 80%; font-style: italic;}, is conditional on having a table column tag <td> immediately followed by a <p> paragraph tag - then it that case use the enclosed style. This adjacent tags provide conditional styling which can be useful for complex but not uncommon formatting situations.

Attribute selector - one can set a different style for tags with specific attributes. This means that a <p> or a <td> tag with the align attribute can have specific styles set for that particular tag and attribute combination. For example td[colspan] { font-size: 125%; font-style: italic; } will only be applied to column td tags that have a colspan attribute. Again this is very useful when a developer needs to make a special styling for all tags with a particular attribute. Its a little easier than having to use a class style in each tag. But only Mozilla/Netscape supports most of this spec not Internet Explorer.

Rather than trying to explain the browser vendor's positions on these options, readers are encouraged to query the browser vendors directly for their implementation schedules of these features.


Top of Page  Tutorials Home  CSS references