Combining CSS Styling With Other Formatting Methods

In this section:

When using a cascading style sheet (CSS) to format a report, you can also apply other formatting methods, such as FOCUS StyleSheets and FOCUS TABLE Language.


Top of page

x
Combining an External CSS With a FOCUS StyleSheet

When using an external cascading style sheet (CSS) to format a report, you can always use a FOCUS StyleSheet at the same time, whether or not you generate an internal cascading style sheet.

An effective approach is to link to an external CSS to provide basic report formatting, and then use a FOCUS StyleSheet to selectively override defaults for styling individual report components. Thus, a CSS BODY or TD rule can provide default report formatting, which you can override by providing native FOCUS StyleSheet attributes for those individual report components.

Exceptions: Even when specifying external CSS classes, use native FOCUS StyleSheet attributes to:

Performance considerations: Unless you also generate an internal cascading style sheet from the FOCUS StyleSheet, combining an external CSS and a FOCUS StyleSheet may reduce the performance benefits associated with the external CSS. This is because you generate more HTML code when styling a report with both external CSS and native FOCUS StyleSheet attributes than if you only use the external CSS. However, this still generates less code than if the report uses only native FOCUS StyleSheet attributes.

Do not double-format. Do not format the same property of the same report component using both an external CSS class (using the CLASS attribute) and a FOCUS StyleSheet attribute, since the class and the StyleSheet attribute could conflict.

For example, do not include the following declarations in the same StyleSheet:

TYPE=Data, COLUMN=Country, COLOR=Orange, $
TYPE=Data, CLASS=TextColor, $

because both try to assign a color to the report's Country column.

You can specify classes and FOCUS StyleSheet attributes that format different report components, and different properties of the same report component. For example, the following declarations are acceptable in the same StyleSheet:

1. TYPE=Heading, COLOR=Green, $ 
1. TYPE=Heading, CLASS=HeadingFontSize, $ 
2. TYPE=Data, Column=Country, BACKCOLOR=Yellow, $ 
2. TYPE=Data, Column=Car, CLASS=DataBackgroundColor, $
  1. These two declarations are compatible because they format different properties (color and font size).
  2. These two declarations are compatible because they format different report components (the Country column and the Car column).

Top of page

x
Combining an External CSS With TABLE Language Formatting

TABLE language instructions. You can use TABLE language formatting instructions, such as HEADING CENTER, PAGE-BREAK, and spot markers, but never apply the same formatting to a report component using both a TABLE language instruction and an external cascading style sheet rule. For example, do not specify both of the following for the same report, because both attempt to align the page heading of the report:


Information Builders