library-mirrors/pure
1
0
Fork 0
mirror of https://github.com/pure-css/pure.git synced 2024-11-24 10:44:21 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

some updates which improve the default alignment of form elements; improves the normalization of select element sizing too

Browse Source
This commit is contained in:
James Alley 2015-02-02 15:38:47 -08:00
parent 614a417a52
commit e3fe17c672
3 changed files with 24 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/buttons/css/buttons-core.css
View File

@ -1,11 +1,10 @@
.pure-button {
/* Structure */
display: inline-block;
*display: inline; /*IE 6/7*/
zoom: 1;
line-height: normal;
white-space: nowrap;
vertical-align: baseline;
vertical-align: middle;
text-align: center;
cursor: pointer;
-webkit-user-drag: none;
@ -13,6 +12,9 @@
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
/* Firefox: Get rid of the inner focus border */

3
src/forms/css/forms.css
View File

@ -27,6 +27,7 @@ so we can ignore the csslint warning.
border: 1px solid #ccc;
box-shadow: inset 0 1px 3px #ddd;
border-radius: 4px;
vertical-align: middle;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
@ -147,7 +148,7 @@ since IE8 won't execute CSS that contains a CSS3 selector.
}
.pure-form select {
/* Normalizes the height; padding is not sufficient. */
height: 2.15em;
height: 2.25em;
border: 1px solid #ccc;
background-color: white;
}

18
src/forms/tests/manual/forms.html
View File

@ -15,6 +15,24 @@
<body>
<h1>Forms Tests</h1>
<h2>Input normalization</h2>
<form class="pure-form">
<fieldset>
<legend>An inline form. Check for alignment and input/select sizing.</legend>
<input type="text" placeholder="text input">
<input type="search" placeholder="search input">
<select name="fooselect">
<option value="CA">CA</option>
<option value="NY">NY</option>
<select>
<button type="submit" class="pure-button">Sign in</button>
</fieldset>
</form>
<h2>Default Form</h2>
<form class="pure-form">