The "CSS style properties." button lets the user quickly customize the screen style of the element being implicitly or explicitly selected. Clicking this button displays a style editor, which may be used to quickly and easily specify one or more
Clicking Customize CSS Stylesheet" dialog box. The body of the rule comprises the properties specified using the style editor, while the selector of the rule is simply the name of selected element. However when selected element is an XHTML element having a
class attribute, this selector is
. In practice, this means that you may have to modify by hand this automatically determined selector in order to make it more specific.
No prior knowledge of CSS is required to use the Styles tab of this style editor: simply check the checkbox corresponding to the style (e.g. "Text color") you want to add, then possibly adjust the style using the button, combobox or numeric field found next to the checkbox.
In the case of the above figure, selected XHTML
span (having a "
class attribute) element is given a dark gray text color, a fixed-width bold font and a slightly smaller text size.
Clicking the "CSS Source" tab lets the user hand edit the CSS properties specified using the Styles tab. The figure below shows you the CSS properties corresponding to the dark gray text color, fixed-width bold font and slightly smaller text size chosen using the Styles tab depicted in the above figure.
When the "CSS Source" tab is selected, its content is used as is (of course after a successful syntax check) to specify the screen style of selected element. This allows typing CSS properties not supported by the Styles tab, for example,
margin or even
The style editor is easy to use however, in some cases, you'll have to workaround some of the limitations of XMLmind XML Editor in terms of CSS support in . Examples:
You may have to check "" in addition to " " in order to successfully add a border around an element.
The box decoration properties (borders, space around content, etc) are not supported for inline elements. The background color is the only property supported for such elements. A workaround consists in typing "
display: inline-block;" in the "CSS Source" tab.