clip results instead of moving them (#2727)

* clip results instead of moving them fixes #1413 fixes #1410 fixes #1686 fixes #2402 fixes #2445 fixes #2185 * no more need for rtl fix in demo
harvesthq · Oct 21, 2016 · 23a3ee6 · 23a3ee6
1 parent dacfa20
commit 23a3ee6
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 15 deletions.
diff --git a/public/index.html b/public/index.html
@@ -6,10 +6,6 @@
   <link rel="stylesheet" href="docsupport/style.css">
   <link rel="stylesheet" href="docsupport/prism.css">
   <link rel="stylesheet" href="chosen.css">
-  <style type="text/css" media="all">
-    /* fix rtl for demo */
-    .chosen-rtl .chosen-drop { left: -9000px; }
-  </style>
 </head>
 <body>
   <form>

diff --git a/public/index.proto.html b/public/index.proto.html
@@ -6,10 +6,6 @@
   <link rel="stylesheet" href="docsupport/style.css">
   <link rel="stylesheet" href="docsupport/prism.css">
   <link rel="stylesheet" href="chosen.css">
-  <style type="text/css" media="all">
-    /* fix rtl for demo */
-    .chosen-rtl .chosen-drop { left: -9000px; }
-  </style>
 </head>
 <body>
   <div id="container">

diff --git a/sass/chosen.scss b/sass/chosen.scss
@@ -14,16 +14,16 @@ $chosen-sprite-retina: url('[email protected]') !default;
   .chosen-drop {
     position: absolute;
     top: 100%;
-    left: -9999px;
     z-index: 1010;
     width: 100%;
     border: 1px solid #aaa;
     border-top: 0;
     background: #fff;
     box-shadow: 0 4px 5px rgba(#000,.15);
+    clip: rect(0,0,0,0);
   }
   &.chosen-with-drop .chosen-drop {
-    left: 0;
+    clip: auto;
   }
   a{
     cursor: pointer;
@@ -136,7 +136,7 @@ $chosen-sprite-retina: url('[email protected]') !default;
   }
   &.chosen-container-single-nosearch .chosen-search {
     position: absolute;
-    left: -9999px;
+    clip: rect(0,0,0,0);
   }
 }
 /* @end */
@@ -373,10 +373,6 @@ $chosen-sprite-retina: url('[email protected]') !default;
       }
     }
   }
-  &.chosen-container-single-nosearch .chosen-search,
-  .chosen-drop {
-    left: 9999px;
-  }
   &.chosen-container-single .chosen-results {
     margin: 0 0 4px 4px;
     padding: 0 4px 0 0;