CSS shorthand properties

CSS 'shorthand properties' allow to store a group of properties in one single property which shortens the way the properties are stored. If for instance a margin should be specified for an object that margin usually applies to a certain side such as top, or left. To store individual margins for all four sides of an object one can specify four CSS attributes for each of the four sides or the individual properties of all four sides can be stored in one shorthand property.

To store values in a shorthand property, they have to follow the order top, right, bottom, left. Individual values can be omitted, if some or all values are equal. E.g. if the margin of all sides is the same, only one value needs to be stored in the shorthand property which will be taken for all four sides.

Example with four equal values: margin:0pt;

Example with four different values: margin:0pt 1pt 2pt 3pt;

Shorthand properties used with HTML tables

For elements of HTML tables modeled by application SimplyHTML the following shorthand properties can be used to shorten attribute expressions inside individual tags:

- margin
- padding
- border-width
- border-color

Class CombinedAttribute

To enable usage of shorthand properties, application SimplyHTML provides class CombinedAttribute . CombinedAttribute models a CSS shorthand property by providing methods to manipulate and store four individual CSS properties in one CSS shorthand property.

It is used in classes SHTMLBoxPainter to render table cells, SHTMLEditorPane to manipulate tables and in SHTMLWriter for writing CSS shorthand properties.

Transforming CSS properties to CSS shorthand properties

In the Java languages all CSS shorthand properties are transformed to 'normal' CSS properties when HTML and CSS is modeled (in an HTMLDocument for instance). So for any CSS shorthand property four individual CSS attributes are created for an element.

CombinedAttribute is constructed from an AttributeSet which may have CSS attributes belonging to a CSS shorthand property or not, so it does not matter whether or not the model uses CSS shorthand properties. When HTML code is to be generated for HTML file creation however, 'normal' CSS properties belonging to a CSS shorthand property need to be transformed from the model to the file accordingly.

Class SHTMLWriter does that by initializing a table of CSS properties for which CSS shorthand properties are to be generated. When creating HTML code, method writeAttributes filters out those single CSS attributes, creates CSS shorthand properties for them, and writes out these instead.