diff --git a/examples/mouse-position.html b/examples/mouse-position.html
index 4bcd30b47f..74f85c76f1 100644
--- a/examples/mouse-position.html
+++ b/examples/mouse-position.html
@@ -8,12 +8,6 @@
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
     <title>Mouse position example</title>
-    <style type="text/css">
-      /* Nullify the default .ol-mouse-position rule */
-      #mouse-position .ol-mouse-position {
-        position: static;
-      }
-    </style>
   </head>
   <body>
 
diff --git a/examples/mouse-position.js b/examples/mouse-position.js
index dc3a2163f7..36d6615ec4 100644
--- a/examples/mouse-position.js
+++ b/examples/mouse-position.js
@@ -13,8 +13,9 @@ var map = new ol.Map({
     new ol.control.MousePosition({
       coordinateFormat: ol.coordinate.toStringHDMS,
       projection: 'EPSG:4326',
-      // comment the following line to have the mouse position
+      // comment the following two lines to have the mouse position
       // be placed within the map.
+      className: 'custom-mouse-position',
       target: document.getElementById('mouse-position'),
       undefinedHTML: '&nbsp;'
     })
