Formulário modelo

by edgardleal

HTML

<div 
  style="background: #fffae2; width : 700px; height : 700px">
<div class="form" style="">
            <form>
            	<h1>Cadastro de ....</h1>
					<div class="formInterno">                     
                      <div class="formLine">
                        <label for="" class="formFieldtxt">Código:</label>
                            <input type="text" class="formField" />
                    </div>
                    <div class="formLine">
                      <label for="" class="formFieldtxt">Descrição:</label>
                            <input type="text" class="formField" />
                    </div>
                <div class="formLine">
                      <label for="" class="formFieldtxt">Data:</label>
                            <input type="text" class="formField date" />
                </div>                        
                    <div class="formLine">
                      <label for="" class="formFieldtxt ui-widget">Tipo:</label>
                      <select name="cliente.tipo" id="" class="formField">
                            <option value="">A</option>
    
                          <option value="">B</option>
                        <option value="">C</option>            
                        </select>
                    </div>
                    
                        
                  <div class="formLinebt">
                        <input type="submit" value="Salvar" class="ui-button button">
                    <button class="ui-button button">Cancelar</button>

                      </div>
                </div>  
            </form>
</div>
    </div>

CSS

.form{
	margin-left:auto;
	margin-right:auto;
	margin-top:25px;
	margin-bottom:auto;
	padding:1px;
	background-color:#FFB33B;;
	width:600px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;    
	}
	
.formInterno{
	padding-left: 20px;
	padding-bottom: 20px;
}
	
.formField{
    min-width : 25px;
    display : inline;
   clear : both;
   float:left;
}
.formField, select{
   width : 180px;
}

.formFieldtxt{
	display : inline;
	clear : both;
	float:left;
	margin-top: 10px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
}


.formLine{
	display: block;
	clear : both;
	margin-top:10px;
	margin-bottom:5px;
}

.formLinebt{
	display: block;
	clear : both;
	margin-top: 95px;
}

.form h1{
	margin-top:0px;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFF;
	font-size: 19px;
	font-weight: normal;
	background-color: #7F3300;
	-webkit-border-top-left-radius: 20px;
	-webkit-border-top-right-radius: 20px;
	-moz-border-radius-topleft: 20px;
	-moz-border-radius-topright: 20px;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 15px;
}

.button{
    height : 25px;    
}

JavaScript

$('.date').datepicker();