/** * * @note css file for form elements * * @appdef fapulous framework * @app-myapp-theme * @app-myapp-used True * @media screen * @valid true * * @author Alp Uçkan * @version 1.1 * @link http://fapulous.77elements.net/ * @copyright Copyright(c) by Alp Uçkan * @license http://sam.zoy.org/wtfpl/ * * @date 2008-09-22 * @lastmodified 2009-10-04 17:24 * * @colordef rgb(0,0,0); Black; Text * @colordef rgb(255,255,255); White; Background * * markup for form elements: * *
*
* Type1: horizontal alignment * *
*
*

required: required

*
*
* *
*
* *
*
* *
*
* * field with validation errors -->
*
* *
*
* *

An error occured in 'Text2'

*
*
* *
*
* *
*
* *
*
* *
*
* Please choose required *
*
* * * * * *
*
* *
*
* Please choose: *
*
* * * * * *
*
* *
*
* *
*
* *
*
* *
*
*

Some notes before submitting the form

* *
*
* *
*
*/ /** * @section general form elements */ form { margin: 1em 0 2em 0; } fieldset { padding: .4375em; } legend { margin-bottom: 1em; padding: .4375em; font-style: italic; font-weight: bold; } /** * @section container class for one line (usually label + form field) */ .formLine { width: 100%; overflow: hidden; margin-bottom: .4375em; } /** * @section typo styles for form elements */ .label, .labeled { font-family: Arial, sans serif; line-height: 1.5; } label, select, .fieldRadio, .fieldCheckbox, .fieldSubmit { cursor: pointer; } .formNotes { } .fieldText, select, .fieldText, textarea, .fieldSubmit { font: 1em Arial, sans serif; padding: .1em .2em; } input:focus, textarea:focus { background: transparent; } /** * @section aligning required images */ label img, .label img { position: relative; top: -.3em; } /** * @section horizontal alignment */ .horiz .label { float: left; width: 20%; margin-right: 1%; text-align: right; } .horiz .labeled, .horiz .formNotes { margin-left : 21%; } .horiz .fieldText, .horiz textarea { width: 78%; } /** * @section vertical alignment */ .vert .label { display: block; padding: 0 0 .2em; } .vert .labeled { margin-left: 0; } .vert .fieldText, .vert textarea { width: 58%; } /** * @section form validation errors */ .error input, .error textarea { border: 2px solid red; } .error label, .error input, .error textarea, .error p { color: red; }