Prevent tables from growing the page horizontally

lib/mv_web/components/core_components.ex

@@ -368,6 +368,7 @@ defmodule MvWeb.CoreComponents do
       end
 
     ~H"""
+    <div class="overflow-auto">
       <table class="table table-zebra">
         <thead>
           <tr>
@@ -423,6 +424,7 @@ defmodule MvWeb.CoreComponents do
           </tr>
         </tbody>
       </table>
+    </div>
     """
   end
 

lib/mv_web/live/components/sort_header_component.ex

@@ -19,7 +19,7 @@ defmodule MvWeb.Components.SortHeaderComponent do
   @impl true
   def render(assigns) do
     ~H"""
-    <div class="tooltip" data-tip={aria_sort(@field, @sort_field, @sort_order)}>
+    <div class="tooltip tooltip-bottom" data-tip={aria_sort(@field, @sort_field, @sort_order)}>
       <button
         type="button"
         aria-label={aria_sort(@field, @sort_field, @sort_order)}