---

StyleT Introduction

The name StyleT stands for Style Tester. However, it is also a surgical probe used for exploratory surgery (Source: American Heritage Dictionary) which is a good description of the work done by this tool!

StyleT provides two major features:

Full CSS Syntax Validation

Support

StyleT is an unsupported tool. We have added it to the Internet SDK because many teams within Microsoft found it useful and we felt Independent Software Vendors and Content Developers would find it equally useful.

You may still mail StySupp@Microsoft.com with comments on this tool, but we can give no guarantee that we can respond to any mails.

Usage

StyleT is a command line application. To run, switch to the MS-DOS Box prompt. To start, just type StyleT. This shows the following help text:

StyleT (Cascading Style Sheet Level 1 Validator) Version 2.0
Copyright (c) 1995-97 Microsoft Corp. All rights reserved.

This tool is unsupported. You can send feedback, suggestions and bug
reports to "StySupp@microsoft.com", but you may not receive a reply.

A full description of all the messages can be found in the accompanying
StyleT Users Guide (StyleT.htm).

StyleT [-p] [-s] [-v] [-w] [-x] filespec
-p Pause after execution
-s Recurse all sub-folders in specified path
-v Verbose
-w Suppress warning messages
-x Suppress warnings about CSS extensions

Usage Examples

StyleT *.*
 Validates all files in a folder

StyleT *.* -v -s > myStyle.log
 Validates all files in the current folder and all folders below it placing the results in a log file.

StyleT c:\myproj\*.css -w > Styles.err
 Validate all the files with the .css extension in the "c:\myproj" folder. Only Fatal and Error messages are produced (-w) and this are placed into the "Styles.err" log file.

---

CSS Style Sheets

Terminology

Here is a quick introduction to some of the terminology used in this document.

Style Sheet Examples

<STYLE TYPE="text/css">
BODY {font: 12pt Arial; font-weight: bold; color: #006699};
H2 {font: 13pt/15pt "Arial, Courier"; font-weight: bold; color: BLACK; margin-left: 0.5in;}
</STYLE>

<a href="default.htm" style="A:link {font: 14pt Arial, Time New Roman; color: lemonChiffon; font-weight:bold}">Home Page</a>

<!-- Absolute Placement Examples -->
<INPUT id=chkMatchCase style="LEFT: 8px; TOP: 80px; WIDTH: 13px; HEIGHT: 13px" type=checkbox>

Style Sheets can occur in HTML files and also in separate files where the <style> tags are not needed.

---

StyleT Messages

StyleT performs extensive CSS validation. In addition to this it will also report on other problems in finds in the files if these could prevent it from finding CSS information.

There are 4 kinds of messages:

Information . These all have the prefix ‘i’. They are not warnings or errors, merely notes of interest.

Warnings. These signify minor problems in the files that StyleT is able to deal with since they do not effect validation. They all have the prefix ‘W’.

Errors. These are more serious problems. It means the CSS information is invalid. All these messages have an ‘E’ prefix.

Fatal Errors. These are serious problems where StyleT is unable to continue working on the file and the validation must be aborted. The files must be fixed in order to continue. These messages have the prefix ‘F’.

Context

Most messages will show the file name and the row and column number. If other context information is available it will also be shown.

Cascading Style General Validation

Warnings

W3011 Non-terminated Comment in Style Sheet. Skipping rest of Style Sheet.

Example:

<style>
H1 {font: Courier}; /* start of comment – but no end
</style>

W3014 Style Sheet Syntax Error. HexColor "value" must consist of 3 or 6 digits for "Property Name" Property

The color value when given as a HexColor must have 3 or 6 digits.

Wrong: BIG {font: 10pt Arial; background: #cccc6}
Right: BIG {font: 10pt Arial; background: #0ccc66}

Errors

E3000 Style Sheet: Badly formed RGB (Red, Green, Blue) Color Value.

Color value (RGB) is invalid. Example:

Wrong: h1 {color: rgb(-2,0,0);}
Right: h1 {color: rgb(2,0,0);}

E3003 Style Sheet: Expected Value for "Property Name" Property.

No value was given. Example:

Wrong: h1 {font-size: ;}
Right: h1 {font-size: 10pt;}

E3004 Style Sheet Syntax Error. Expected: ':'

A colon (':') was expected. Example:

Wrong: h1 {color}
Right: h1 {color: blue}

E3005 Style Sheet Syntax Error. Expected one of the following selectors: ident, #name, .name, ":link", ":visited", ":active" ":first-line" or ":first-letter"

The expected selector was not found. Example:

Wrong: A:visitd {font: 9pt Arial; color: #000000; font-weight: bold}
Right: A:visited {font: 9pt Arial; color: #000000; font-weight: bold}

E3006 Style Sheet Syntax Error. Expected: '}'

A closing bracket ('}') was expected. Example:

Wrong: h1 {font-size: 10pt 
Right: h4 {font-size: 20pt}

E3008 Style Sheet: Illegal Value "value" for "Property Name" Property.

The given value is not allowed for this property. Example:

h1 {color: DodgyBlue}

E3009 Non-terminated String in Style Sheet. Skipping rest of Style Sheet.

A quoted string in the Style Sheet has not been properly terminated. Example:

Wrong: H1 {font: "Courier };
Right: H1 {font: "Courier"};

E3012 Style Sheet Syntax Error. Expected: ';'

The syntax of the Style Sheets is invalid. The expected character was not found.

Wrong: <p style="color: red  font-size: 10pt">
Right: <p style="color: red; font-size: 10pt">

E3018 Style Sheet Syntax Error. Expected one of the following elements: ident, string, number {unit}, #ffffff, url(...), rgb(...).

Expected item was not found. Example:

Wrong: H1 {font:  }
Right: H1 {font: 10pt Arial;}

E3020 Style Sheet Syntax Error. Expected: '{'

An opening bracket ('{') was expected. Example:

Wrong: H1  font-size: 10pt}
Right: H1 {font-size: 10pt}

E3023 Style Sheet Syntax Error. Invalid Property Name: "Property Name"

The Property Name is not valid. Example:

Wrong: P {font-name: Arial}
Right: P {font-family: Arial}

E3024 Style Sheet: Badly formed URL.

The URL value is invalid. Example:

Wrong: Body {background: url(texture.gif white;}
Right: Body {background: url(texture.gif) white;}

E3027 Unexpected end of style sheet.

The Style Sheet ended unexpectedly. Example:

Wrong: <style>Body </style>
Right: <style>Body {background: white} </style>

Cascading Style Sheet Level 1 Extensions

These are known extensions specific to Internet Explorer 3.0 and 4.0. Since they are not in the CSS Level 1 specification, there is no guarantee other browsers support them.

Extension Warnings

W3002 Style Sheet Syntax Error. Illegal semicolon ';' found.

These are very commonly placed between Selectors. Example:

H1 {font-family: Arial;};

W3010 Style Sheet Syntax. Quotes used around non-string Value (value) of 'Property Name' Property

According to CSS1, this item should not be quoted. Example:

H1 {color: "white"}

W3013 Style Sheet Property Name is an extension to CSS1: ‘Property Name’

This property is non-standard according to CSS1. Example:

<img src=xxx.gif style="Width: 40px; Height: 40px; Top: 40px; Left: 40px">

W3016 Style Sheet Syntax. '#' missing from HexColor Value "value" for "Property Name" Property.

According to CSS1, all HexColor values should be preceded by ‘#’. Example:

Wrong: BODY {margin-left=0; font: 9pt Arial; color: 000000;}
Right: BODY {margin-left=0; font: 9pt Arial; color: #000000;}

W3017 Unexpected ‘@import’ in the middle of Style Sheet

This element should occur first in a Style Sheet.

<STYLE TYPE="text/css">
H1 {color: blue }
@import url(http://style.com/basic);
</STYLE>

W3019 CSS1 Style Sheet Syntax. '=' used instead of ':'

This is very common after Property Names. Example:

Wrong: H1 {font-family = courier}
Right: H1 {font-family: courier}

W3021 Style Sheet Property Value (value) for ‘Property Name’ is an extension to CSS1.

This value is non-standard according to CSS1. Example:

P {color: HotPink}

W3026 Style Sheet: Non-standard HTML comment used: "comment". Expected "<!--" or "-->" for CSS1.

CSS1 only specifies that comments of the format ‘<!-- … -->’ be used to wrap Style Sheets. Example:

Wrong: <STYLE> <!- h1 {color: white} -> </STYLE>
OK: h1 {color: white} <!-- Here is my comment -->
Right: h1 {color: white} /* Here is my comment */

W3029 Negative Margin Value used for Property. This may result in illegible output in CSS compliant browsers.

There are significant differences in the interpretation of negative margin value between Internet Explorer 3.0 and 4.0. This warning is there to help you pinpoint these styles so that you can check they work correctly in different browsers. Example:

<h1 {margin-left: -40pt; }