Product: Studio
 Versions Prior to 11.1.1
 
 The following are a few tips in regards to using CSS in a Studio project. The CSS import system was not intended for production level CSS files, as they usually rely heavily on the HTML structure.
 
 The structure of a CSS file is very simple and only consist of two elements, Style name and style attributes. The only requirement on the file itself is that it be a text file with the .css extension. There is no header or footer needed within the CSS file. At its simplest level, typing the following in a text file and saving it with the CSS extension is all that's needed.
 
 .mystyle {font-family:Arial;}
 
 This would define one style with one attribute.

 In CSS, a style may be named by using any of the 3 varieties of selectors. Class, ID and Type. The first two are similar in that they both require the styled object to be flagged with a "class=" or "ID=". 'Type' takes advantage of the HTML structure to automatically assign a style. So for instance all text with H1 markup will automatically be styled accordingly.
 
 Since HTML tags, Classes or ID are not dealt with in iRise, all of these selectors get converted to simple style names. The styles are imported, but nothing will be applied based on HTML structure.
 
 The way to recognize these is by looking at the css file for the following:
 .mystyle The dot at the beginning defines it as a class
 #mystyle The pound sign defines this as an ID
 H1 An HTML tag without a period or pound sign defines it as a Type
 

With any of the 3 varieties of selectors, additional selectors may be combined in order to more finely define where the style will be applied. For instance:
 .contentArea TD H1
 As mentioned above these will be converted to simple style names.
 

While most naming conventions will work, known issues exist around names that include underscores or slashes.

Links are different in that they have several states within a single selector or style name. These are typically written as:
 a:link
 a:hover
 a:hover
 a:visited
 Named Link Style
 a.mystyle:link
 a.mystyle:hover
 a.mystyle:active
 a:mystyle:visited
 
 While CSS allows other ways to write Named link styles, iRise will only accept
 a.stylename:link
 stylename:link
 Named link styles written in other formats will need to be manually fixed in the CSS file.
 
 The 4 states will be imported to their corresponding subtab within a style. The style name being whatever comes before the colon.
 

Since there is no CSS standard for specifying states within menus, no styles will prefill the menu subtabs. All menu styles must be defined in iRise.
 

No styles are currently being directed into the Form Field Tab. All form field styles must be defined in iRise.
 

Within a style, formatting is defined by a series of attributes and values. While CSS allows for a wide variety of attributes, only a limited set makes sense or are compatible with the way iRise works. For instance, positioning would not make sense in Studio since all widgets are placed by dragging.
 

Attributes that are WYSIWYG in Studio and have a UI element to control it.
 

Attributes that we are not currently able to WYSIWYG, but are passed through to the browser. Some of these attributes will break the WYSIWYG between Studio and the Browser. These attributes will be saved with the style and will appear in the "Other Attributes" area in the style editor.

When troubleshooting a file, keep in mind that the import may fail silently and that the styles listed in the import confirmation are listed in order. Some of the common issues to look out for are:
 - missing open and close curlies around the attributes.
 - missing Colon before the value
 - missing Semi-Colon is needed in between attributes. The last attribute does not require a semi-colon.
 - underscores in the style name
 - improperly formatted Named Link Styles