KNACSS/css/04-forms.css

96 lines
1.5 KiB
CSS
Raw Permalink Normal View History

2013-03-31 10:19:51 +02:00
/* ----------------------------- */
2013-03-31 10:19:51 +02:00
/* ==forms */
2013-03-31 10:19:51 +02:00
/* ----------------------------- */
/* thanks to HTML5boilerplate,
* github.com/nathansmith/formalize
* and www.sitepen.com
*/
2013-03-31 10:19:51 +02:00
/* buttons */
.btn {
display: inline-block;
}
2013-03-31 10:19:51 +02:00
/* forms items */
form,
fieldset {
border: none;
}
input,
button,
select,
label,
.btn {
vertical-align: middle;
font-family: inherit;
font-size: inherit;
}
label {
display: inline-block;
vertical-align: middle;
cursor: pointer;
2013-03-31 10:19:51 +02:00
}
2013-03-31 10:19:51 +02:00
legend {
border: 0;
white-space: normal;
2013-03-31 10:19:51 +02:00
}
2013-03-31 10:19:51 +02:00
textarea {
min-height: 5em;
vertical-align: top;
font-family: inherit;
font-size: inherit;
resize: vertical;
2013-03-31 10:19:51 +02:00
}
2014-05-07 10:53:15 +02:00
/* clickable input types in iOS */
2013-03-31 10:19:51 +02:00
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
cursor: pointer;
-webkit-appearance: button;
2013-03-31 10:19:51 +02:00
}
input[type="search"] {
-webkit-appearance: textfield;
}
2013-03-31 10:19:51 +02:00
/* if select styling bugs on WebKit */
/* 'x' appears on right of search input when text is entered. This removes it */
2013-03-31 10:19:51 +02:00
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
display: none;
2013-03-31 10:19:51 +02:00
}
::-webkit-input-placeholder {
color: #777;
}
2013-03-31 10:19:51 +02:00
input:-moz-placeholder,
textarea:-moz-placeholder {
color: #777;
}
2013-03-31 10:19:51 +02:00
/* Removes inner padding and border in FF3+ */
2013-03-31 10:19:51 +02:00
button::-moz-focus-inner,
input[type='button']::-moz-focus-inner,
input[type='reset']::-moz-focus-inner,
input[type='submit']::-moz-focus-inner {
border: 0;
padding: 0;
}