Commit 7f71611c authored by Aron Carroll's avatar Aron Carroll

Fix the height of the tag input

This fixes an issue where the difference in input height between
Firefox and Chrome/Safari causes the input area to jump.
parent 9f805cc1
...@@ -11,7 +11,7 @@ tags-input { ...@@ -11,7 +11,7 @@ tags-input {
.tags { .tags {
@include form-input; @include form-input;
@include clearfix; @include pie-clearfix;
&.focused { &.focused {
@include form-input-focus; @include form-input-focus;
...@@ -20,17 +20,22 @@ tags-input { ...@@ -20,17 +20,22 @@ tags-input {
// Input // Input
.input { .input {
float: left; float: left;
margin-top: .2667em; padding: .1333em 0;
padding: .2em 0 .2em;
outline: none; outline: none;
border: none !important; border: none !important;
background: none; background: none;
color: $gray; color: $gray;
// Firefox and Webkit render input boxes at different heights. This
// causes issues when the tags (which render consistentely) are inserted
// and cause the height of the faux input to jump.
height: 1.4667em;
} }
} }
.tag-list { .tag-list {
margin-top: -.33em; // Absorb the first row of margin-top on the tags. margin-top: -.33em; // Absorb the first row of margin-top on the tags.
float: left;
} }
.tag-item { .tag-item {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment