Merge pull request #3070 from XRPLF/issue-2671

Author: AKCodez

blog/index.page.tsx

@@ -207,7 +207,7 @@ export default function Index() {
                       className="mb-4"
                     />
                     <div
-                      className={`d-inline-block label blog-category-${card.category_id}`}
+                      className={`d-block label blog-category-${card.category_id}`}
                     >
                       {translate(card.category)}
                     </div>

static/css/devportal2024-v1.css

@@ -55,6 +55,26 @@
         width: 100%;
       }
     }
+    .label{
+      width: fit-content;
+    }
+  }
+
+  // Add styles to ensure proper wrapping on tablet sizes
+  @media (min-width: 768px) and (max-width: 991px) {
+    #category-list {
+      display: block;
+      
+      img {
+        display: block;
+        margin-bottom: 10px;
+      }
+      
+      .label {
+        display: block !important;
+        margin-bottom: 15px;
+      }
+    }
   }
 
   .category_sidebar {