Some examples of question part with classes

Multiple short text

<ul class="subquestions-list questions-list text-list">
  <li class="question-item answer-item text-item" id="javatbdSGQA">
    <label for="answerSGQA">Some example subquestion</label>
     <span><input type="text" value="" id="answerSGQA" name="SGQA" size="20" class="text empty"></span>
  </li>
</ul>

Array question type

<table class="question subquestion-list questions-list ">
	<caption class="hide read">Some explanation for accessibility.</caption>
	<colgroup class="col-responses">
		<col width="50%" class="col-answers">
		<col width="25%" class="odd">
		<col width="13.3%" class="col-no-answer even">
	</colgroup>
	<thead>
		<tr class="array1 dontread">
			<td>&nbsp;</td>
			<th>1</th>
			<th>No answer</th>
		</tr>
	</thead>
	<tbody>
		<tr class="array2 answers-list radio-list" id="javatbdSGQ">
			<th width="20%" class="answertext">Some example subquestion
			</th>
			<td class="answer_cell_001 answer-item radio-item">
				<label for="answerSGQA" class="hide read">1</label>
				<input type="radio" value="1" id="answerSGQA" name="SGQA" class="radio">
			</td>
			<td class="answer-item radio-item noanswer-item">
				<label for="answerSGQA" class="hide read">No answer</label>
				<input type="radio" value="" id="answerSGQA" name="SGQA" class="radio">
			</td>
		</tr>
	</tbody>
</table>

The full list of question classes

The full list of validation classes

Importing styles into your custom template

Internet explorer conditional style sheets

Alternative solution for internet explorer

And in template.css use:

.ie6{/*specific for internet explorer 6*/}
.ielt8{/*specific for internet explorer 6 and 7*/}
.ie{/*specific for all internet explorer */}

Right-to-left (RTL) languages and justify

Keywords

 Deprecated : This features is deprecated in version 3.0.

Input/Buttons

• submit (Submit Buttons)
  
• text (Text Inputs - for short free text, date, and numerical type)
• answertext (Text of answers)
• radio (Radio Buttons)
• checkbox (Check Boxes)
• select (Select / List Boxes)
• textarea (Large text inputs - for long free text)
• clearall (The "Exit and Clear Survey" link)
• rank (The rank style question. Doesn't set the colour of the select box or the text boxes, but it does allow the changing of background colour, text colour, size etc., for the rest of the ranking question)
• graph (The "percentage completed" graph table)
• innergraph (The table inside the graph table - this contains the 0% and 100% text. Use this for changing the size of this text)
• question (General settings for any question that is displayed within a table. Generally, you should use this to make sure that their font size and color is the same as you have used elsewhere as a default)
• mandatory  (Mandatory questions)
• input-error (User input error - for if a user has made a mistake with a mandatory question or question with validation)
• array1 and array2 (These two styles are cycled when presenting the range of answers for an array type question. This allows you to set an alternating background color for these question types. Array1 is also used for the column headings in these question types)
• errormandatory (Sets the color and style of the "This question is mandatory" error message)
• warningjs (Sets the color and style of the warning message displayed if the participant's browser has javascript disabled)
  

• surveycontact (The contact message shown on the start page)
• tokenmessage (used for messages inside the survey, e.g. the session expired error message)

<div class='new_name'></div>

Styling the progress bar

#progress-wrapper .ui-widget-header {
 background-color: #3300FF;
}

To change the border color of the bar, add something like the following to the end of your template.css file:

#progress-wrapper .ui-widget-content,
#progress-wrapper .ui-widget-header {
 border: 1px solid #FF0000;
}

Advanced features available to developers

• Disable XSS filter - in Global settings -> Security, set "Filter HTML for XSS" to No.
• Enter your script in the source of a question or group description.