diff --git a/addons/mail/static/src/attachments/attachment_list.xml b/addons/mail/static/src/attachments/attachment_list.xml
index c71a8c35f22..88528ca256e 100644
--- a/addons/mail/static/src/attachments/attachment_list.xml
+++ b/addons/mail/static/src/attachments/attachment_list.xml
@@ -10,7 +10,7 @@
                 'ms-2 ps-4': isInChatWindowAndIsAlignedRight and !env.inComposer,
             }"
         >
-            <div class="d-flex flex-grow-1 flex-wrap" role="menu">
+            <div class="d-flex flex-grow-1 flex-wrap mx-1" role="menu">
                 <div t-foreach="imagesAttachments" t-as="attachment" t-key="attachment.id" t-att-aria-label="attachment.filename"
                     class="o-mail-AttachmentImage d-flex position-relative flex-shrink-0 mw-100 mb-1 me-1"
                     t-att-title="attachment.name"
@@ -43,9 +43,9 @@
                     </div>
                 </div>
             </div>
-            <div class="d-flex flex-grow-1 flex-wrap mt-1">
+            <div class="d-flex flex-grow-1 flex-wrap mt-1 mx-1">
                 <div t-foreach="nonImagesAttachments" t-as="attachment" t-key="attachment.id"
-                    class="o-mail-AttachmentCard d-flex rounded bg-300 mb-1 me-1 mw-100"
+                    class="o-mail-AttachmentCard d-flex rounded bg-300 mb-1 me-1 mw-100 overflow-auto"
                     t-att-class="{
                         'ms-1': isInChatWindowAndIsAlignedRight,
                         'me-1': !isInChatWindowAndIsAlignedRight,
diff --git a/addons/mail/static/src/core_ui/message.xml b/addons/mail/static/src/core_ui/message.xml
index 0e054fc1914..4d262bed023 100644
--- a/addons/mail/static/src/core_ui/message.xml
+++ b/addons/mail/static/src/core_ui/message.xml
@@ -33,7 +33,7 @@
                             </div>
                         </t>
                     </div>
-                    <div class="w-100" t-att-class="{ 'flex-grow-1': message.composer }">
+                    <div class="w-100 overflow-auto" t-att-class="{ 'flex-grow-1': message.composer }">
                         <div t-if="!props.squashed" class="o-mail-Message-header d-flex flex-wrap align-items-baseline">
                             <span t-if="(message.author or message.email_from) and shouldDisplayAuthorName" class="o-mail-Message-author" t-att-class="{ 'cursor-pointer o_redirect': hasAuthorClickable }" t-att-title="authorText" t-on-click="ev => this.onClickAuthor(ev)">
                                 <strong class="me-1 text-truncate"><t t-if="message.author" t-esc="message.author.name"/><t t-else="" t-esc="message.email_from"/></strong>