Fix vertical alignment of text within select input on Firefox.

diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index 5202e9c87105f790aca8b0c20f67b3c48251d656..7efe76cb116060cc10d5a76d372bd685b7c36003 100644 (file)
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -948,6 +948,15 @@ header .search_forms,
     border-radius: 0 2px 2px 0;
   }
 
+  select {
+    border-radius: $border-radius;
+        border: $border;
+        background-color: white;
+        /* this next line is to polyfill the vertical alignment of text within a select element,
+         * which is different between firefox and chrome. */
+        padding: 0.3em 0;
+  }
+
   .query_options {
     text-align: right;
     font-size: 10px;

diff --git a/app/assets/stylesheets/parameters.scss b/app/assets/stylesheets/parameters.scss
index 989444a62d77999c5f96dfa5b935122833623250..eb363459c22854b1ec15be3ba9a1400c3d5f46ab 100644 (file)
--- a/app/assets/stylesheets/parameters.scss
+++ b/app/assets/stylesheets/parameters.scss
@@ -16,3 +16,4 @@ $sidebarWidth: 350px;
 $keyline: 1px solid $lightgrey;
 $border-radius: 3px;
 $list-highlight: #FFFFE6;
+$border: 1px solid $grey;