cFlex Guide // Form

cFlex License



Form Adjustments


In Dev-View at Firefox, i made nearly no resize on the inputs and buttons. I made it all flat, like all <3 actually.

form fieldset{
  padding:1.2vh 0.75em;
  border:1px solid #a1a1a1;
}
form legend{
  width:auto; padding-right:0.25em; padding-left:0.25em;
}
form label{
  padding-top:0.5vh; padding-bottom:0.5vh;
}
form div,
form span,
form input,
form select{
  margin-bottom:0.5em;
}
form input,
form select,
form option,
form textarea{
  padding:5.45px 0.5em;
  border:1px solid #a1a1a1;
}
form [type="radio"],
form [type="checkbox"]{
  max-width:16px; margin-top:1px; margin-right:1em;
}
form [type="radio"]{
  margin-right:0.1em;
}
form [type="radio"] ~label{
  position:relative; top:-2px; margin-right:1em;
}
form button{
  margin-top:2vh;
}

button, a.cf_btn,
button:visited, a.cf_btn:visited{
  width:auto; padding:5.45px 1.42em;
  background:#e0e0e0;
  border:1px solid #a1a1a1;
}
a.cf_btn{
  padding:5.45px 1.50em;
}

Preview 320px-Width Example

legend

If you still want to edit/hack the form style, there is still space for …



form types

type: color

date & time





search form




compact inline




stacked This is a required field.




This is a required field.