diff --git a/addons/hr_expense/static/src/scss/hr_expense.scss b/addons/hr_expense/static/src/scss/hr_expense.scss
index c33accd90a4..0dcad3f74fb 100644
--- a/addons/hr_expense/static/src/scss/hr_expense.scss
+++ b/addons/hr_expense/static/src/scss/hr_expense.scss
@@ -1,41 +1,13 @@
-.o_content {
-    .o_expense_card {
-        border-bottom: 1px solid darken($o-control-panel-background-color, 20%);
-        border-right: 1px solid darken($o-control-panel-background-color, 20%);
-        text-align: center;
-        padding: 10px;
-        .content_center {
-            margin-top: auto;
-            margin-bottom: auto;
-        }
-        div {
-            line-height: 1;
-        }
-    }
-
-    .o_expense_container {
-        @include o-position-sticky($left: 0px);
-    }
-
-    .o_expense_card_last {
-        border-right: 0px;
-    }
-}
 .hr_expense {
-    &.o_list_view, &.o_kanban_view {
-        height: auto;
-        min-height: auto;
+    @include media-breakpoint-up(md) {
+        &.o_list_view, &.o_kanban_view {
+            min-height: auto;
+        }
     }
 
-    &.o_kanban_view {
-        position: relative;
-    }
-}
-.hr_expense .o_view_nocontent {
-    top: 10%;
-}
-.o_view_nocontent {
-    .o_nocontent_help {
+    .o_view_nocontent {
+        top: 10%;
+
         .o_view_nocontent_expense_receipt:before {
             @extend %o-nocontent-init-image;
             @include size(300px, 230px);
@@ -45,14 +17,3 @@
         }
     }
 }
-.o_control_panel .o_list_buttons {
-    .o_button_upload_expense {
-        margin-left: 3px;
-        margin-right: 3px;
-    }
-}
-.o_expense_line_list {
-    .o_list_button {
-        padding-right: 0px;
-    }
-}
diff --git a/addons/hr_expense/static/src/xml/documents_upload_views.xml b/addons/hr_expense/static/src/xml/documents_upload_views.xml
index 3cb7b2bbd79..ab16011ad68 100644
--- a/addons/hr_expense/static/src/xml/documents_upload_views.xml
+++ b/addons/hr_expense/static/src/xml/documents_upload_views.xml
@@ -35,13 +35,13 @@
 
     <t t-extend="KanbanView.buttons" t-name="ExpensesKanbanView.buttons">
         <t t-jquery="button:last" t-operation="after">
-            <button type="button" class="d-none d-md-inline o_button_upload_expense btn btn-primary">
+            <button type="button" class="d-none d-md-inline o_button_upload_expense btn btn-primary mx-1">
                 Upload
             </button>
         </t>
 
         <t t-jquery="button:first" t-operation="before">
-            <button type="button" class="d-inline d-md-none o_button_upload_expense btn btn-primary">
+            <button type="button" class="d-inline d-md-none o_button_upload_expense btn btn-primary mx-1">
                 Scan
             </button>
         </t>
diff --git a/addons/hr_expense/static/src/xml/expense_dashboard.xml b/addons/hr_expense/static/src/xml/expense_dashboard.xml
index 7cda520fac8..63058ec3fdf 100644
--- a/addons/hr_expense/static/src/xml/expense_dashboard.xml
+++ b/addons/hr_expense/static/src/xml/expense_dashboard.xml
@@ -2,20 +2,14 @@
 
 <templates id="template">
     <t t-name="hr_expense.dashboard_list_header">
-        <div class="o_expense_container d-flex o_form_statusbar">
+        <div class="o_expense_container position-sticky start-0 d-flex o_form_statusbar">
             <t t-foreach="expenses" t-as="expense">
-                <div t-attf-class="o_expense_card o_arrow_button flex-grow-1 d-flex flex-column border-right-0">
-                    <div class="content_center">
-                        <div>
-                            <span t-esc="render_monetary_field(expenses[expense]['amount'], expenses[expense]['currency'])" class="h2 text-odoo"/>
-                        </div>
-                        <b class="m-2"><span t-esc="expenses[expense]['description']"/></b>
-                    </div>
+                <div t-attf-class="o_expense_card o_arrow_button flex-grow-1 d-flex flex-column p-3 border-bottom text-center">
+                    <span t-esc="render_monetary_field(expenses[expense]['amount'], expenses[expense]['currency'])" class="h2 m-0 text-odoo"/>
+                    <b class="mx-2" t-esc="expenses[expense]['description']"/>
                 </div>
-                <div t-if="expense !== 'approved'" t-attf-class="o_expense_card o_arrow_button flex-grow-1 d-flex flex-column border-right-0">
-                    <div class="content_center">
-                        <span class="fa fa-angle-right fa-3x"/>
-                    </div>
+                <div t-if="expense !== 'approved'" t-attf-class="o_expense_card o_arrow_button flex-grow-1 d-flex flex-column p-3 border-bottom text-center">
+                    <i class="fa fa-angle-right fa-3x"/>
                 </div>
             </t>
         </div>
diff --git a/addons/hr_expense/views/hr_expense_views.xml b/addons/hr_expense/views/hr_expense_views.xml
index 376e97fac55..067bb1352b5 100644
--- a/addons/hr_expense/views/hr_expense_views.xml
+++ b/addons/hr_expense/views/hr_expense_views.xml
@@ -99,7 +99,7 @@
                 <xpath expr="//tree" position="attributes">
                     <!-- Display the tree dashboard view with the header -->
                     <attribute name="js_class">hr_expense_tree_dashboard_header</attribute>
-                    <attribute name="class">hr_expense</attribute>
+                    <attribute name="class">hr_expense h-auto</attribute>
                 </xpath>
             </field>
         </record>
@@ -231,7 +231,7 @@
             <field name="name">hr.expense.kanban</field>
             <field name="model">hr.expense</field>
             <field name="arch" type="xml">
-                <kanban class="o_kanban_mobile hr_expense" sample="1" js_class="hr_expense_kanban">
+                <kanban class="o_kanban_mobile hr_expense position-relative h-auto" sample="1" js_class="hr_expense_kanban">
                     <field name="name"/>
                     <field name="employee_id"/>
                     <field name="total_amount"/>