diff --git a/addons/web/static/src/views/fields/properties/properties_field.js b/addons/web/static/src/views/fields/properties/properties_field.js
index c4bac226cc7..7f819f52f7f 100644
--- a/addons/web/static/src/views/fields/properties/properties_field.js
+++ b/addons/web/static/src/views/fields/properties/properties_field.js
@@ -82,6 +82,21 @@ export class PropertiesField extends Component {
         return propertiesValues.filter((definition) => !definition.definition_deleted);
     }
 
+    /**
+     * Return the current properties value splitted in multiple groups/columns.
+     *
+     * @returns {Array<Array>}
+     */
+    get groupedPropertiesList() {
+        const columns = this.env.isSmall ? 1 : this.props.columns;
+        // If no properties, assure that the "Add Property" button is shown.
+        const res = [...Array(columns)].map(col => []);
+        this.propertiesList.forEach((val, index) => {
+            res[index % columns].push(val);
+        });
+        return res;
+    }
+
     /**
      * Return false if we should not close the popover containing the
      * properties definition based on the event received.
diff --git a/addons/web/static/src/views/fields/properties/properties_field.scss b/addons/web/static/src/views/fields/properties/properties_field.scss
index 49cbfefe058..c62b5d95c44 100644
--- a/addons/web/static/src/views/fields/properties/properties_field.scss
+++ b/addons/web/static/src/views/fields/properties/properties_field.scss
@@ -1,9 +1,5 @@
 .o_field_properties {
     width: 100%;
-
-    .o_group {
-        gap: map-get($spacers, 2) $o-horizontal-padding * 2;
-    }
 }
 
 // The web client will add a "o_field_invalid" class when the field is considered
@@ -38,37 +34,11 @@
 }
 
 .o_property_field {
-    .o_property_field_value {
-        height: fit-content;
-        padding: 0 $o-innergroup-rpadding 0 0;
-    }
-
-    .o_field_property_dropdown input {
-        cursor: pointer;
-    }
-
-    .o_input_dropdown {
-        min-width: 100%;
-    }
-
     .popover-body {
         min-width: 500px;
     }
-    .o_td_label {
-        min-width: 150px;
-    }
 
     .o_field_property_label {
-        max-width: 150px;
-        width: fit-content;
-        margin-right: -25px !important;
-
-        b {
-            word-break: break-word;
-            max-height: 100px;
-            overflow-y: hidden;
-        }
-
         &:hover .o_field_property_open_popover,
         .o_field_property_open_popover:focus {
             opacity: 1;
@@ -90,7 +60,7 @@
     }
 
     .o_property_field_highlight .o_field_property_empty_label,
-    .o_property_field_highlight b, {
+    .o_property_field_highlight b {
         border: 1px solid $primary;
         padding: 5px;
         margin: -5px;
@@ -110,36 +80,10 @@
     font-size: inherit;
     box-shadow: 0 3rem 5rem rgba($black, .18) !important;
     box-sizing: border-box;
-    .end-auto {
-        display: none;
-    }
-
-    .o_input_dropdown {
-        width: 100%;
-    }
 }
 
 .o_xxs_form_view .o_field_properties {
     // mobile view
-    .o_property_field {
-        margin-bottom: 20px;
-        min-width: 100%;
-        flex-wrap: wrap;
-        padding: 0;
-
-        .o_td_label,
-        .o_property_field_value {
-            min-width: 100%;
-            padding: 0 !important;
-            &>* {
-                max-width: 100%;
-            }
-            .o_input_dropdown {
-                min-width: 0;
-                width: 100%;
-            }
-        }
-    }
     .o_field_property_add,
     .o_field_property_open_popover {
         display: none;
diff --git a/addons/web/static/src/views/fields/properties/properties_field.xml b/addons/web/static/src/views/fields/properties/properties_field.xml
index 6451dc711a2..ea157368efa 100644
--- a/addons/web/static/src/views/fields/properties/properties_field.xml
+++ b/addons/web/static/src/views/fields/properties/properties_field.xml
@@ -1,24 +1,25 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <templates xml:space="preserve">
     <t t-name="web.PropertiesField" owl="1">
-        <div t-ref="properties" class="w-100">
-            <div class="o_group w-100 grid my-0">
-                <div
-                    t-foreach="propertiesList"
-                    t-as="propertyConfiguration"
-                    t-key="propertyConfiguration.name"
-                    class="o_property_field d-flex flex-row align-items-center justify-content-start"
-                    t-att-property-name="propertyConfiguration.name"
-                    t-attf-class="g-col-lg-{{12 / props.columns}} g-col-12">
-                    <t t-set="domId" t-value="generateUniqueDomID()"/>
-                    <div class="o_td_label">
-                        <label t-attf-class="o_field_property_label o_form_label {{state.movedPropertyName === propertyConfiguration.name ? 'o_property_field_highlight' : ''}} d-flex flex-row align-items-center"
+        <div t-ref="properties" class="row align-items-start">
+            <t t-foreach="groupedPropertiesList" t-as="propertiesListGroup" t-key="propertiesListGroup_index">
+                <div class="o_inner_group grid col-lg-6">
+                    <div
+                        t-foreach="propertiesListGroup"
+                        t-as="propertyConfiguration"
+                        t-key="propertyConfiguration.name"
+                        class="o_property_field d-sm-contents mb-3"
+                        t-att-property-name="propertyConfiguration.name">
+                        <t t-set="domId" t-value="generateUniqueDomID()"/>
+                        <label
+                            t-attf-class="o_field_property_label o_form_label text-break {{state.movedPropertyName === propertyConfiguration.name ? 'o_property_field_highlight' : ''}} d-flex align-items-center"
                             t-att-for="domId">
                             <b
                                 t-if="propertyConfiguration.string &amp;&amp; propertyConfiguration.string.length"
                                 t-out="propertyConfiguration.string"
-                                class="text-900 d-inline-block mw-100"/>
-                            <i t-else="" class="o_field_property_empty_label">
+                                class="text-900"/>
+                            <i
+                                t-else="" class="o_field_property_empty_label">
                                 New Property
                             </i>
                             <i
@@ -26,35 +27,38 @@
                                 class="o_field_property_open_popover fa fa-pencil ms-2"
                                 t-on-click="(event) => this.onPropertyEdit(event, propertyConfiguration.name)"/>
                         </label>
+                        <div class="o_property_field_value">
+                            <PropertyValue
+                                id="domId"
+                                canChangeDefinition="state.canChangeDefinition"
+                                comodel="propertyConfiguration.comodel || ''"
+                                context="context"
+                                domain="propertyConfiguration.domain || '[]'"
+                                readonly="props.readonly"
+                                selection="propertyConfiguration.selection"
+                                string="propertyConfiguration.string"
+                                tags="propertyConfiguration.tags"
+                                type="propertyConfiguration.type"
+                                value="propertyConfiguration.value"
+                                onChange.bind="(value) => this.onPropertyValueChange(propertyConfiguration.name, value)"
+                                onTagsChange.bind="(newTags, newValue) => this.onTagsChange(propertyConfiguration.name, newTags, newValue)"
+                            />
+                        </div>
                     </div>
-                    <div class="o_property_field_value align-top w-100">
-                        <PropertyValue
-                            id="domId"
-                            canChangeDefinition="state.canChangeDefinition"
-                            comodel="propertyConfiguration.comodel || ''"
-                            context="context"
-                            domain="propertyConfiguration.domain || '[]'"
-                            readonly="props.readonly"
-                            selection="propertyConfiguration.selection"
-                            string="propertyConfiguration.string"
-                            tags="propertyConfiguration.tags"
-                            type="propertyConfiguration.type"
-                            value="propertyConfiguration.value"
-                            onChange.bind="(value) => this.onPropertyValueChange(propertyConfiguration.name, value)"
-                            onTagsChange.bind="(newTags, newValue) => this.onTagsChange(propertyConfiguration.name, newTags, newValue)"
-                        />
+                    <div 
+                        t-if="propertiesList.length % props.columns === propertiesListGroup_index"
+                        t-attf-class="o_field_property_add {{props.columns !== 1 ? 'g-col-2' : ''}}">
+                        <button
+                            t-if="!props.readonly &amp;&amp; state.canChangeDefinition"
+                            class="btn btn-light text-muted text-break m-0"
+                            t-on-click="onPropertyCreate">
+                            <i class="fa fa-plus"/>
+                            Add a Property
+                        </button>
                     </div>
                 </div>
-                <div class="o_field_property_add" t-attf-class="g-col-lg-{{12 / props.columns}} g-col-12">
-                    <button
-                        t-if="!props.readonly &amp;&amp; state.canChangeDefinition"
-                        class="btn btn-light text-muted m-0"
-                        t-on-click="onPropertyCreate">
-                        <i class="fa fa-plus"/>
-                        Add a Property
-                    </button>
-                </div>
-            </div>
+            </t>
+
         </div>
     </t>
 </templates>
diff --git a/addons/web/static/src/views/fields/properties/property_tags.xml b/addons/web/static/src/views/fields/properties/property_tags.xml
index b44d4219ca3..2485f8bd477 100644
--- a/addons/web/static/src/views/fields/properties/property_tags.xml
+++ b/addons/web/static/src/views/fields/properties/property_tags.xml
@@ -2,7 +2,7 @@
 <templates xml:space="preserve">
     <t t-name="web.PropertyTags" owl="1">
         <!-- Copy many2many tags style without duplicating all the CSS -->
-        <div t-attf-class="o_field_property_tag o_field_widget o_field_many2many_tags py-1 d-flex flex-row align-items-center flex-wrap pt-2 w-100 {{props.readonly ? 'readonly' : ''}}">
+        <div t-attf-class="o_field_property_tag o_field_widget o_field_many2many_tags d-flex align-items-center {{props.readonly ? 'readonly' : ''}}">
             <TagsList
                 tags="tagListItems"
                 displayBadge="displayBadge"