diff --git a/src/pages/05_quotation/preview/ViewHeader.vue b/src/pages/05_quotation/preview/ViewHeader.vue
index d3455ec4..ecd08850 100644
--- a/src/pages/05_quotation/preview/ViewHeader.vue
+++ b/src/pages/05_quotation/preview/ViewHeader.vue
@@ -85,8 +85,10 @@ function titleMode(mode: View): string {
       </article>
       <article>
         <b>{{ $t('quotation.customer') }}</b>
-        <span>
+        <div>
           {{ getCustomerName(customer, { noCode: true, locale: 'tha' }) }}
+        </div>
+        <span>
           {{
             formatAddress({
               address: customer.address,
diff --git a/src/pages/11_credit-note/document-view/ViewHeader.vue b/src/pages/11_credit-note/document-view/ViewHeader.vue
index 3304cdfb..9d56ac4d 100644
--- a/src/pages/11_credit-note/document-view/ViewHeader.vue
+++ b/src/pages/11_credit-note/document-view/ViewHeader.vue
@@ -86,7 +86,9 @@ function titleMode(mode: View): string {
       <article>
         <b>ลูกค้า</b>
         <span>
-          {{ getCustomerName(customer, { noCode: true, locale: 'tha' }) }}
+          <div>
+            {{ getCustomerName(customer, { noCode: true, locale: 'tha' }) }}
+          </div>
           {{
             formatAddress({
               address: customer.address,
diff --git a/src/pages/12_debit-note/document-view/ViewHeader.vue b/src/pages/12_debit-note/document-view/ViewHeader.vue
index e5fa6975..f6174ed9 100644
--- a/src/pages/12_debit-note/document-view/ViewHeader.vue
+++ b/src/pages/12_debit-note/document-view/ViewHeader.vue
@@ -86,7 +86,9 @@ function titleMode(mode: View): string {
       <article>
         <b>ลูกค้า</b>
         <span>
-          {{ getCustomerName(customer, { noCode: true, locale: 'tha' }) }}
+          <div>
+            {{ getCustomerName(customer, { noCode: true, locale: 'tha' }) }}
+          </div>
           {{
             formatAddress({
               address: customer.address,