diff --git a/src/elements/OcBreadcrumb.vue b/src/elements/OcBreadcrumb.vue
index 1c96d96e9..6af276c37 100644
--- a/src/elements/OcBreadcrumb.vue
+++ b/src/elements/OcBreadcrumb.vue
@@ -38,7 +38,7 @@
  *
  *  - text: mandatory element, holds the text which is to be displayed in the breadcrumb
  *  - to: optional element, the vue router link
- *  -
+ *
  */
 export default {
   name: "oc-breadcrumb",
@@ -80,7 +80,9 @@ export default {
 <docs>
 ```vue
 <template>
-  <oc-breadcrumb :items="items" home></oc-breadcrumb>
+  <section>
+    <oc-breadcrumb :items="items" home></oc-breadcrumb>
+  </section>
 </template>
 <script>
   export default {
@@ -90,7 +92,7 @@ export default {
           {text:'First folder',to:{path:'folder'}},
           {text:'Subfolder', onClick:() => alert('Breadcrumb clicked!')},
           {text:'Deep',to:{path:'folder'}},
-          {text:'Deeper'},
+          {text:'Deeper ellipsize in responsive mode'},
         ]
       }
     }
diff --git a/src/styles/theme/oc-breadcrumb.scss b/src/styles/theme/oc-breadcrumb.scss
index 69698a9ee..120a9eaae 100644
--- a/src/styles/theme/oc-breadcrumb.scss
+++ b/src/styles/theme/oc-breadcrumb.scss
@@ -4,6 +4,8 @@
 // ========================================================================
 
 .oc-breadcrumb {
+  @extend .uk-overflow-hidden;
+
   &-list {
     @extend .uk-visible\@s;
     @extend .uk-breadcrumb;