Created
January 22, 2013 10:58
-
-
Save stephen-james/4593799 to your computer and use it in GitHub Desktop.
10gen education login screen input height fix
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
textarea, input[type="text"], input[type="email"], input[type="password"] { | |
background: #fafafa; | |
border: 1px solid #c8c8c8; | |
-webkit-border-radius: 3px; | |
-moz-border-radius: 3px; | |
-ms-border-radius: 3px; | |
-o-border-radius: 3px; | |
border-radius: 3px; | |
-webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6), inset 0 0 3px 0 rgba(0, 0, 0, 0.1); | |
-moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6), inset 0 0 3px 0 rgba(0, 0, 0, 0.1); | |
box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6), inset 0 0 3px 0 rgba(0, 0, 0, 0.1); | |
-webkit-box-sizing: border-box; | |
-moz-box-sizing: border-box; | |
box-sizing: border-box; | |
font: 300 1rem/1.6rem "PT Sans", Verdana, Geneva, sans-serif; | |
height: 35px !important; | |
padding: 5px 12px; | |
vertical-align: top; | |
-webkit-font-smoothing: antialiased; | |
} |
Good catch! I'm applying the fix right now.
great! thanks for an awesome site!
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Problem with login input height on Chrome Version 24.0.1312.52 m
Seems that CSS rule input[type="email"] is getting overridden incorrectly by .modal .inner-wrapper .form input[type="email"] rule
(See how height 25px is being applied, height 35.px is overridden)
You can get around this with using !important, as per the CSS gist above, see result below...