Accessible Forms CSS


/ Published in: Other
Save to your folder(s)



Copy this code and paste it in your HTML
  1. form.cmxform fieldset,form#standardForm fieldset{margin-bottom:10px;border:1px solid #ccc;background:#f0f0f0;}
  2. form.cmxform fieldset fieldset,form#standardForm fieldset fieldset{background:none;border:none;}
  3. form.cmxform legend,form#standardForm legend{padding: 0 2px;font-weight:bold;}
  4. form.cmxform label,form#standardForm label{display:inline-block;line-height:1.8;vertical-align:top;}
  5. form.cmxform fieldset ol,form#standardForm fieldset ol{margin:0;padding:0;}
  6. form.cmxform fieldset li,form#standardForm fieldset li{list-style:none;padding:5px 10px 7px;margin:0;}
  7. form.cmxform em,form#standardForm em{font-weight:bold;font-style:normal;font-size:130%;color:#f00;}
  8. form.cmxform label,form#standardForm label{width:120px; /* Width of labels */}
  9. form.cmxform label.wider,form#standardForm label.wider{width:150px;}
  10. form.cmxform textarea,form#standardForm textarea{font-size:100%;font-family:verdana;}
  11. form.cmxform .autoSize,form#standardForm .autoSize{width:auto;border:none;}
  12. form.cmxform input.submit,form#standardForm input.submit{cursor:pointer;border:1px solid #fff;background:#84b84a;color:#fff;font-size:110%;font-weight:bold;padding:3px;}
  13. form.cmxform input.submit:focus,form#standardForm input.submit:focus{background:#84b84a;}
  14. form.cmxform select,form#standardForm select{width:300px;}
  15. form.cmxform input.widerInput,form#standardForm input.widerInput{width:300px;}
  16.  

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.