Advanced Search

Return to Snippet

Revision: 31660
at October 23, 2010 09:48 by alozuldo
Updated Code 
-----------CSS-----------------

label {
  width: 4em;
  float: left;
  text-align: right;
  margin-right: 0.5em;
  display: block;
}

.submit input {
  margin-left: 4.5em;
}
#form input:hover, #form textarea:hover{
	background-color: lightyellow;
}
input:focus, textarea:focus{
background-color: lightyellow;
}

-----------Form----------------

<form action="#">
<p><label for="name">Name</label> <input type="text" id="name" /></p>
<p><label for="e-mail">E-mail</label> <input type="text" id="e-mail" /></p>
<p class="submit"><input type="submit" value="Submit" /></p>
</form>

Revision: 31659
at October 23, 2010 09:43 by alozuldo
Updated Code 
-----------CSS-----------------

label {
  width: 4em;
  float: left;
  text-align: right;
  margin-right: 0.5em;
  display: block;
}

.submit input {
  margin-left: 4.5em;
}
input:focus, textarea:focus{
background-color: lightyellow;
}

-----------Form----------------

<form action="#">
<p><label for="name">Name</label> <input type="text" id="name" /></p>
<p><label for="e-mail">E-mail</label> <input type="text" id="e-mail" /></p>
<p class="submit"><input type="submit" value="Submit" /></p>
</form>

Revision: 31658
at October 4, 2010 18:34 by alozuldo
Updated Code 
-----------CSS-----------------

label {
  width: 4em;
  float: left;
  text-align: right;
  margin-right: 0.5em;
  display: block;
}

.submit input {
  margin-left: 4.5em;
}


-----------Form----------------

<form action="#">
<p><label for="name">Name</label> <input type="text" id="name" /></p>
<p><label for="e-mail">E-mail</label> <input type="text" id="e-mail" /></p>
<p class="submit"><input type="submit" value="Submit" /></p>
</form>

Revision: 31657
at September 10, 2010 04:39 by alozuldo
Initial Code 
-----------CSS-----------------

label
{
width: 4em;
float: left;
text-align: right;
margin-right: 0.5em;
display: block
}

.submit input
{
margin-left: 4.5em;
}


-----------Form----------------

<form action="#">
<p><label for="name">Name</label> <input type="text" id="name" /></p>
<p><label for="e-mail">E-mail</label> <input type="text" id="e-mail" /></p>
<p class="submit"><input type="submit" value="Submit" /></p>
</form>
Initial URL 
http://www.webcredible.co.uk/user-friendly-resources/css/css-forms.shtml
Initial Description 

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
Simple XHTML Form with CSS

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    
form, css

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
XHTML