diff --git a/css/ol.css b/css/ol.css
index 5b5ca519b9..5dc3fe2d68 100644
--- a/css/ol.css
+++ b/css/ol.css
@@ -226,7 +226,7 @@ button.ol-full-screen-true:after {
 }
 .ol-zoom .ol-has-tooltip:hover [role=tooltip],
 .ol-zoom .ol-has-tooltip:focus [role=tooltip] {
-  bottom: 1.1em;
+  top: 1.1em;
 }
 .ol-full-screen .ol-has-tooltip:hover [role=tooltip],
 .ol-full-screen .ol-has-tooltip:focus [role=tooltip] {
@@ -237,31 +237,44 @@ button.ol-full-screen-true:after {
 
 .ol-zoomslider {
   position: absolute;
-  top: 67px;
-  left: 8px;
+  top: 4.5em;
+  left: .5em;
+
   background: #eee;
   background: rgba(255, 255, 255, 0.4);
   border-radius: 4px;
-  width: 28px;
-  height: 200px;
   outline: none;
   overflow: hidden;
-  padding: 0;
+  
+  width: 1.5675em;
+  height: 200px;
+  padding: 3px;
   margin: 0;
 }
 .ol-zoomslider-thumb {
   position: absolute;
   display: block;
-  padding: 0;
-  margin: 2px;
   background: #7b98bc;
   background: rgba(0,60,136,0.5);
   border-radius: 2px;
   outline: none;
   overflow: hidden;
-  height: 20px;
-  width: 24px;
+  cursor: pointer;
+
+  font-size: 1.14em;
+  height: 1em;
+  width: 1.375em;
+  margin: 3px;
+  padding: 0;
 }
+.ol-touch .ol-zoomslider {
+  top: 5.5em;
+  width: 2.052em;
+}
+.ol-touch .ol-zoomslider-thumb {
+  width: 1.8em;
+}
+
 .ol-zoom-extent button,
 .ol-attribution,
 .ol-full-screen button,
diff --git a/examples/zoomslider.html b/examples/zoomslider.html
index cdb173dc33..13995fecc8 100644
--- a/examples/zoomslider.html
+++ b/examples/zoomslider.html
@@ -13,19 +13,19 @@
  * The zoomslider in the second map shall be placed between the zoom-in and
  * zoom-out buttons.
  */
-#map2 .ol-zoom a.ol-zoom-out {
+#map2 .ol-zoom .ol-zoom-out {
   margin-top: 202px;
 }
 #map2 .ol-zoomslider {
   background-color: transparent;
-  top: 34px;
-  left: 9px;
-  width: 24px;
+  top: 2.3em;
 }
-#map2 .ol-zoomslider-thumb {
-  border-radius: 2px;
-  width: 24px;
-  height: 12px;
+
+#map2 .ol-touch .ol-zoom .ol-zoom-out { 
+  margin-top: 212px;
+}
+#map2 .ol-touch .ol-zoomslider {
+  top: 2.75em;
 }
 
 /**