diff --git a/main/static/main/css/styles.css b/main/static/main/css/styles.css
index fe577019186c81a3b94c6527cf3ee9093c5a363f..373bd22c8e22bc8708a761ff3b586ac1a46909a3 100644
--- a/main/static/main/css/styles.css
+++ b/main/static/main/css/styles.css
@@ -3801,6 +3801,14 @@ div.twitter-carousel .slick-arrow.slick-disabled:before, div.twitter-carousel .s
   overflow: auto;
 }
 
+.overflow-hidden{
+  overflow: hidden;
+}
+
+.text-ellipsis{
+  text-overflow: ellipsis;
+}
+
 .rounded-full{
   border-radius: 9999px;
 }
diff --git a/main/styleguide/source/_patterns/molecules/blocks/block-download.mustache b/main/styleguide/source/_patterns/molecules/blocks/block-download.mustache
index 3d209869a143d70b42e42b101a7997c4dc5f069a..cca58b7d73a097d09f08c7549dfb53b2e424245e 100644
--- a/main/styleguide/source/_patterns/molecules/blocks/block-download.mustache
+++ b/main/styleguide/source/_patterns/molecules/blocks/block-download.mustache
@@ -2,10 +2,10 @@
   <div class="flex justify-start xl:justify-end grid-left-side">
     <i class="ico--download p-2 text-3xl md:text-4xl xl:text-7xl xl:mr-12"></i>
   </div>
-  <div class="grid-content flex items-center flex-wrap gap-3">
-    <div class="flex items-center bg-white h-11 p-1 mr-3">
+  <div class="grid-content flex items-center flex-wrap gap-3 overflow-hidden">
+    <div class="flex items-center bg-white h-11 p-1 mr-3 overflow-hidden">
       <span class="font-bold mr-1">Stáhnout soubor: </span>
-      <span>prehled-tabulka.pdf</span>
+      <span class="overflow-hidden text-ellipsis">prehledasdfasndfjansdjkfnkjasndkjfajsdnfkjtabulka.pdf</span>
     </div>
     {{> atoms-button-animated(btn-text: "Stáhnout", classes: "h-11 p-0") }}
   </div>
diff --git a/main/styleguide/source/_patterns/molecules/blocks/block-image.mustache b/main/styleguide/source/_patterns/molecules/blocks/block-image.mustache
index fc71e80117a95142009bdfdb78c3e277debda738..232d25294e2837d125537e2e7463e4851003286b 100644
--- a/main/styleguide/source/_patterns/molecules/blocks/block-image.mustache
+++ b/main/styleguide/source/_patterns/molecules/blocks/block-image.mustache
@@ -1,11 +1,11 @@
 <div class="grid-container px-3 py-3 mb-4 bg-grey-150 xl:py-0 xl:mb-20">
-  <div class="grid-content-with-right-side flex flex-wrap gap-3 xl:gap-5">
+  <div class="grid-content-with-right-side flex flex-wrap gap-3 xl:gap-5 overflow-hidden">
     <img src="https://i.picsum.photos/id/547/480/300.jpg?hmac=Y7cmYUqM4jIvrQzzO8VTM0oiedlqvSPOzXH_iRSK87w" alt="" class="w-full max-w-sm">
-    <div class="flex flex-col justify-between">
+    <div class="flex flex-col justify-between overflow-hidden">
       <a href="" class="mt-4 xl:mt-8 mb-2 font-bold hover:no-underline leading-5">
         Et harum quidem rerum facilis est et expedita distinctio.
       </a>
-      <span class="text-sm text-grey-200 uppercase mb-4 xl:mb-6">zdroj: www.internet.cz</span>
+      <span class="text-sm text-grey-200 uppercase mb-4 xl:mb-6 overflow-hidden text-ellipsis">zdroj: www.internet.cz</span>
     </div>
   </div>
 </div>
diff --git a/main/templates/main/blocks/article_download_block.html b/main/templates/main/blocks/article_download_block.html
index fcc2be01e628b4540e79f78ee24e565e9ae210e8..7f61e04febbb136f645e2a53802356206ed55909 100644
--- a/main/templates/main/blocks/article_download_block.html
+++ b/main/templates/main/blocks/article_download_block.html
@@ -2,14 +2,14 @@
   <div class="flex justify-start xl:justify-end grid-left-side">
     <i class="ico--download p-2 text-3xl md:text-4xl xl:text-7xl xl:mr-12"></i>
   </div>
-  <div class="grid-content flex items-center flex-wrap gap-3">
-    <div class="flex items-center bg-white h-11 p-1 mr-3">
+  <div class="grid-content flex items-center flex-wrap gap-3 overflow-hidden">
+    <div class="flex items-center bg-white h-11 p-1 mr-3 overflow-hidden">
       <span class="font-bold mr-1">Stáhnout soubor: </span>
-      <span>{{ self.file }}</span>
+      <span class="overflow-hidden text-ellipsis">{{ self.file }}</span>
     </div>
     <a href="{{ self.file.url }}" class="btn btn__slide__wrap h-11 p-0" download>
       <span class="btn text-lg bg-black text-white w-32 lg:text-base">Stáhnout</span>
       <span class="btn text-lg bg-white text-black w-32 lg:text-base">Stáhnout</span>
     </a>
   </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/main/templates/main/blocks/article_image_block.html b/main/templates/main/blocks/article_image_block.html
index 6c19f20ae8f527733c2018ca9af47614f70a8e50..6ad3cd79a154f1c1b10647f008c57d64b9e7aa41 100644
--- a/main/templates/main/blocks/article_image_block.html
+++ b/main/templates/main/blocks/article_image_block.html
@@ -1,15 +1,15 @@
 {% load wagtailimages_tags %}
 
 <div class="grid-container px-3 py-3 mb-4 bg-grey-150 xl:py-0 xl:mb-20">
-    <div class="grid-content-with-right-side flex flex-wrap gap-3 xl:gap-5">
+    <div class="grid-content-with-right-side flex flex-wrap gap-3 xl:gap-5 overflow-hidden">
         {% image self.image max-500x500 as image %}
         <img src="{{ image.url }}"
              alt="" class="w-full max-w-sm">
-        <div class="flex flex-col justify-between">
+        <div class="flex flex-col justify-between overflow-hidden">
             <a href="{{ self.href }}" class="mt-4 xl:mt-8 mb-2 font-bold hover:no-underline leading-5">
                 {{ self.text }}
             </a>
-            <span class="text-sm text-grey-200 uppercase mb-4 xl:mb-6">zdroj: {{ self.href }}</span>
+            <span class="text-sm text-grey-200 uppercase mb-4 xl:mb-6 overflow-hidden text-ellipsis">zdroj: {{ self.href }}</span>
         </div>
     </div>
-</div>
\ No newline at end of file
+</div>