CSS classes: Form widget

Following is the list of CSS classes applied to forms widget:

CSS class name  Class set to Default HTML tag 
sfLeftLbls Form wrapper when labels are left aligned. <div>
sfRightLbls Form wrapper when labels are right aligned. <div>
sfTopLbls Form wrapper when labels are top aligned. <div>
sfErrorSummary Error summary on top of the form. <div>
sfSuccess Message when form is submitted successfully. <div>
sfFormTitle Wrapper of Section header form widget. <h2>
sfTitleSmall Wrapper of Section header form widget when Title font size is set to Small (14px). <h2>
sfTitleMedium Wrapper of Section header form widget when Title font size is set to Medium (18px). <h2>
sfTitleLarge Wrapper of Section header form widget when Title font size is set to Large (24px). <h2>
sfFormInstructions Wrapper of Instructional text form widget. <div>
sfTxtLbl Field label of Textbox, Multiple choice, Checkboxes, Paragraph text box, Dropdown list form widgets. <label>
sfFieldWrp Inner field wrapper of Textbox, Multiple choice, Checkboxes, Paragraph text box, Dropdown list form widgets. <div> in Textbox and Paragraph text box form widgets, <span> in Multiple choice, Checkboxes, Dropdown list form widgets.
sfExample Field example. <div>
sfError Inline error. <div>
sfTxt Input field of Textbox and Paragraph text box form widgets. <input> in  Textbox widget, <textarea> in Paragraph text box widget
sfFormBox Wrapper of Textbox form widget. <div>
sfTxtBoxSmall Wrapper of Textbox when Text box size (Appearance tab) is Small (120px). <div>
sfTxtBoxMedium Wrapper of Textbox when Text box size (Appearance tab) is Medium (300px). <div>
sfTxtBoxLarge Wrapper of Textbox when Text box size (Appearance tab) is Large (400px). <div>
sfFormBlock Wrapper of Paragraph text box form widget. <div>
sfTxtBlockSmall Wrapper of Paragraph text box when Paragraph Text box size (Appearance tab) is Small (300x60px). <div>
sfTxtBlockMedium Wrapper of Paragraph text box when Paragraph Text box size (Appearance tab) is Medium (300x100px). <div>
sfTxtBlockLarge Wrapper of Paragraph text box when Paragraph Text box size (Appearance tab) is Large (420x260px). <div>
sfFormRadiolist Wrapper of Multiple choice form widget. <div>
sfRadioList Inner wrapper of radio buttons of Multiple choice form widget. <span>
sfFormCheckboxlist Wrapper of Checkboxes form widget. <div>
sfCheckListBox Inner wrapper of checkboxes of Checkboxes form widget. <span>
sfFormDropdown Wrapper of Dropdown list form widget. <div>
sfDdlSmall Wrapper of Dropdown list when Text box size (Appearance tab) is Small 120px. <div>
sfDdlMedium Wrapper of Dropdown list when Text box size (Appearance tab) is Medium 300px. <div>
sfDdlLarge Wrapper of Dropdown list when Text box size (Appearance tab) is Large 420px. <div>
sfDropdownList Inner wrapper of dropdown menu of Dropdown list form widget. <span>
sfFormSubmit Wrapper of Submit button form widget. <div>
sfSubmitBtnSmall Wrapper of Submit button form widget when Button size is set to Small (13px font-size of the button). <div>
sfSubmitBtnMedium Wrapper of Submit button form widget when Button size is set to Medium (14px font-size of the button). <div>
sfSubmitBtnLarge Wrapper of Submit button form widget when Button size is set to Large (18px font-size of the button). <div>

Was this article helpful?