diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroup.component.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroup.component.js
index 82112012c0..3445b4039c 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroup.component.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypegroup.component.js
@@ -45,9 +45,9 @@
         vm.onChangeSortOrderValue( {group: vm.group});
       }
     }
-    function clickComposition (documentTypeId) {
+    function clickComposition (contentTypeId) {
       if (vm.onClickComposition) {
-        vm.onClickComposition({documentTypeId: documentTypeId});
+        vm.onClickComposition({contentTypeId: contentTypeId});
       }
     }
   }
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypeproperty.component.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypeproperty.component.js
index 8f27332ec2..c96944dbd5 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypeproperty.component.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypeproperty.component.js
@@ -12,6 +12,7 @@
     vm.edit = edit;
     vm.remove = remove;
     vm.changeSortOrderValue = changeSortOrderValue;
+    vm.clickComposition = clickComposition;
 
     function edit () {
       if (vm.onEdit) {
@@ -31,6 +32,12 @@
       }
     }
 
+    function clickComposition(contentTypeId) {
+      if (vm.onClickComposition) {
+        vm.onClickComposition({ contentTypeId: contentTypeId });
+      }
+    }
+
   }
 
   const umbContentTypePropertyComponent = {
@@ -41,6 +48,7 @@
       onEdit: '&',
       onRemove: '&',
       onChangeSortOrderValue: '&',
+      onClickComposition: '&?',
       valServerFieldAlias: '@',
       valServerFieldLabel: '@',
       valTabAlias: '@'
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypetab.component.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypetab.component.js
index 6c0e5c8baf..5fb8297847 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypetab.component.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/contenttype/umbcontenttypetab.component.js
@@ -59,9 +59,9 @@
       }
     }
 
-    function clickComposition (documentTypeId) {
+    function clickComposition(contentTypeId) {
       if (vm.onClickComposition) {
-        vm.onClickComposition({documentTypeId: documentTypeId});
+        vm.onClickComposition({ contentTypeId: contentTypeId});
       }
     }
 
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js
index 79da9e3ac6..9a116beb5a 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js
@@ -484,9 +484,9 @@
 
             };
 
-            scope.openDocumentType = (documentTypeId) => {
+            scope.openContentType = (contentTypeId) => {
                 const editor = {
-                    id: documentTypeId,
+                    id: contentTypeId,
                     submit: () => {
                         const args = { node: scope.model };
                         eventsService.emit("editors.documentType.reload", args);
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less
index cae8a1c253..486c0f1336 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less
@@ -714,7 +714,7 @@ input.umb-group-builder__group-title-input:disabled:hover {
 }
 
 .umb-group-builder__property-tags.-right {
-    right: 0;
+    right: 4px;
     left: auto;
 }
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property.html b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property.html
index fff779e626..9166f0c8ab 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/contenttype/umb-content-type-property.html
@@ -3,147 +3,144 @@
   <!-- property meta text -->
   <div class="umb-group-builder__property-meta" ng-class="{'-full-width': vm.sortable}" data-element="{{vm.valTabAlias}}">
 
-      <ng-form name="propertyTypeForm">
-          <div class="control-group -no-margin" ng-if="!vm.sortable">
+    <ng-form name="propertyTypeForm">
+      <div class="control-group -no-margin" ng-if="!vm.sortable">
 
-              <div class="umb-group-builder__property-meta-alias umb-locked-field__text cursor-not-allowed" style="padding-left: 1px" ng-if="vm.property.inherited || vm.property.locked">{{ vm.property.alias }}</div>
-              <umb-locked-field
-                  ng-if="!vm.property.inherited && !vm.property.locked"
-                  locked="locked"
-                  ng-model="vm.property.alias"
-                  placeholder-text="'Alias...'"
-                  server-validation-field="{{ vm.valServerFieldAlias }}">
-              </umb-locked-field>
+        <div class="umb-group-builder__property-meta-alias umb-locked-field__text cursor-not-allowed" style="padding-left: 1px" ng-if="vm.property.inherited || vm.property.locked">{{ vm.property.alias }}</div>
+        <umb-locked-field ng-if="!vm.property.inherited && !vm.property.locked"
+                          locked="locked"
+                          ng-model="vm.property.alias"
+                          placeholder-text="'Alias...'"
+                          server-validation-field="{{ vm.valServerFieldAlias }}">
+        </umb-locked-field>
 
-              <div class="umb-group-builder__property-meta-label">
-                  <textarea localize="placeholder"
-                            placeholder="@placeholders_label"
-                            ng-model="vm.property.label"
-                            ng-disabled="vm.property.inherited || vm.property.locked"
-                            name="groupName"
-                            umb-auto-resize
-                            required
-                            val-server-field="{{ vm.valServerFieldLabel }}">
+        <div class="umb-group-builder__property-meta-label">
+          <textarea localize="placeholder"
+                    placeholder="@placeholders_label"
+                    ng-model="vm.property.label"
+                    ng-disabled="vm.property.inherited || vm.property.locked"
+                    name="groupName"
+                    umb-auto-resize
+                    required
+                    val-server-field="{{ vm.valServerFieldLabel }}">
                   </textarea>
 
-                  <div ng-messages="propertyTypeForm.groupName.$error" show-validation-on-submit>
-                      <div class="umb-validation-label" ng-message="valServerField">{{propertyTypeForm.groupName.errorMsg}}</div>
-                      <div class="umb-validation-label" ng-message="required"><localize key="contentTypeEditor_requiredLabel">Required label</localize></div>
-                  </div>
-
-              </div>
-
-              <div class="umb-group-builder__property-meta-description">
-                  <textarea
-                      localize="placeholder"
-                      placeholder="@placeholders_enterDescription"
-                      ng-model="vm.property.description"
-                      ng-disabled="vm.property.inherited || vm.property.locked"
-                      umb-auto-resize>
-                  </textarea>
-              </div>
+          <div ng-messages="propertyTypeForm.groupName.$error" show-validation-on-submit>
+            <div class="umb-validation-label" ng-message="valServerField">{{propertyTypeForm.groupName.errorMsg}}</div>
+            <div class="umb-validation-label" ng-message="required"><localize key="contentTypeEditor_requiredLabel">Required label</localize></div>
           </div>
-      </ng-form>
 
-      <div ng-if="vm.sortable" class="flex items-center">
-          <umb-icon icon="icon-navigation" class="icon" ng-if="!vm.property.inherited" style="margin-right: 10px;"></umb-icon>
-          <span class="umb-group-builder__property-meta-label">{{ vm.property.label }}</span>
-          <span class="umb-group-builder__property-meta-alias" style="margin-bottom: 0; margin-left: 5px; margin-top: 1px;">({{ vm.property.alias }})</span>
-          <input name="propertySortOrder" type="number" class="umb-group-builder__group-sort-value umb-property-editor-tiny" ng-model="vm.property.sortOrder" ng-disabled="vm.property.inherited" ng-blur="vm.changeSortOrderValue()" />
+        </div>
+
+        <div class="umb-group-builder__property-meta-description">
+          <textarea localize="placeholder"
+                    placeholder="@placeholders_enterDescription"
+                    ng-model="vm.property.description"
+                    ng-disabled="vm.property.inherited || vm.property.locked"
+                    umb-auto-resize>
+                  </textarea>
+        </div>
       </div>
+    </ng-form>
+
+    <div ng-if="vm.sortable" class="flex items-center">
+      <umb-icon icon="icon-navigation" class="icon" ng-if="!vm.property.inherited" style="margin-right: 10px;"></umb-icon>
+      <span class="umb-group-builder__property-meta-label">{{ vm.property.label }}</span>
+      <span class="umb-group-builder__property-meta-alias" style="margin-bottom: 0; margin-left: 5px; margin-top: 1px;">({{ vm.property.alias }})</span>
+      <input name="propertySortOrder" type="number" class="umb-group-builder__group-sort-value umb-property-editor-tiny" ng-model="vm.property.sortOrder" ng-disabled="vm.property.inherited" ng-blur="vm.changeSortOrderValue()" />
+    </div>
 
   </div>
 
 
   <div tabindex="-1" class="umb-group-builder__property-preview" ng-if="!vm.sortable" ng-class="{'-not-clickable': !vm.sortable && (vm.property.inherited || vm.property.locked)}">
 
-      <div class="umb-group-builder__property-tags">
+    <div class="umb-group-builder__property-tags">
 
-          <span class="umb-group-builder__property-tag -white">
-              <span ng-if="vm.property.dataTypeName !== undefined">{{vm.property.dataTypeName}}</span>
-              <span ng-if="vm.property.dataTypeName == undefined"><localize key="general_preview">Preview</localize></span>
-          </span>
-
-          <div class="umb-group-builder__property-tag -white" ng-if="vm.property.validation.mandatory">
-              <span class="umb-group-builder__property-tag-icon">*</span>
-              <localize key="general_mandatory">Mandatory</localize>
-          </div>
-
-          <div class="umb-group-builder__property-tag -white" ng-if="vm.property.showOnMemberProfile">
-              <umb-icon icon="icon-eye" class="umb-group-builder__property-tag-icon"></umb-icon>
-              <localize key="contentTypeEditor_showOnMemberProfile">Show on member profile</localize>
-          </div>
-
-          <div class="umb-group-builder__property-tag -white" ng-if="vm.property.memberCanEdit">
-              <umb-icon icon="icon-edit" class="umb-group-builder__property-tag-icon"></umb-icon>
-              <localize key="contentTypeEditor_memberCanEdit">Member can edit</localize>
-          </div>
-
-          <div class="umb-group-builder__property-tag -white" ng-if="vm.property.isSensitiveData">
-              <umb-icon icon="icon-lock" class="umb-group-builder__property-tag-icon"></umb-icon>
-              <localize key="contentTypeEditor_isSensitiveData">Is sensitive data</localize>
-          </div>
-
-          <div class="umb-group-builder__property-tag -white" ng-if="vm.property.allowCultureVariant">
-              <umb-icon icon="icon-shuffle" class="umb-group-builder__property-tag-icon"></umb-icon>
-              <localize key="contentTypeEditor_cultureVariantLabel">Vary by culture</localize>
-          </div>
-
-          <div class="umb-group-builder__property-tag -white" ng-if="vm.property.allowSegmentVariant">
-              <umb-icon icon="icon-shuffle" class="umb-group-builder__property-tag-icon"></umb-icon>
-              <localize key="contentTypeEditor_segmentVariantLabel">Vary by segments</localize>
-          </div>
+      <span class="umb-group-builder__property-tag -white">
+        <span ng-if="vm.property.dataTypeName !== undefined">{{vm.property.dataTypeName}}</span>
+        <span ng-if="vm.property.dataTypeName == undefined"><localize key="general_preview">Preview</localize></span>
+      </span>
 
+      <div class="umb-group-builder__property-tag -white" ng-if="vm.property.validation.mandatory">
+        <span class="umb-group-builder__property-tag-icon">*</span>
+        <localize key="general_mandatory">Mandatory</localize>
       </div>
 
-      <div class="umb-group-builder__property-tags -right">
-
-          <div class="umb-group-builder__property-tag" ng-if="vm.property.inherited">
-              <umb-icon icon="icon-merge" class="umb-group-builder__property-tag-icon"></umb-icon>
-              <span style="margin-right: 3px"><localize key="contentTypeEditor_inheritedFrom">Inherited from</localize></span>
-              {{vm.property.contentTypeName}}
-          </div>
-
-          <div class="umb-group-builder__property-tag" ng-if="vm.property.locked">
-              <umb-icon icon="icon-lock" class="umb-group-builder__property-tag-icon"></umb-icon>
-              <localize key="general_locked">Locked</localize>
-          </div>
-
+      <div class="umb-group-builder__property-tag -white" ng-if="vm.property.showOnMemberProfile">
+        <umb-icon icon="icon-eye" class="umb-group-builder__property-tag-icon"></umb-icon>
+        <localize key="contentTypeEditor_showOnMemberProfile">Show on member profile</localize>
       </div>
 
-      <ng-form inert class="umb-group-builder__property-preview-form" name="propertyEditorPreviewForm" umb-disable-form-validation ng-click="vm.edit()" tabindex="-1">
-          <umb-property-editor
-              ng-if="vm.property.view !== undefined"
-              model="vm.property"
-              preview="true">
-          </umb-property-editor>
-      </ng-form>
+      <div class="umb-group-builder__property-tag -white" ng-if="vm.property.memberCanEdit">
+        <umb-icon icon="icon-edit" class="umb-group-builder__property-tag-icon"></umb-icon>
+        <localize key="contentTypeEditor_memberCanEdit">Member can edit</localize>
+      </div>
 
-      <button type="button" aria-label="Open settings" class="umb-group-builder__open-settings" ng-if="!vm.property.inherited && !vm.property.locked" ng-click="vm.edit()"></button>
+      <div class="umb-group-builder__property-tag -white" ng-if="vm.property.isSensitiveData">
+        <umb-icon icon="icon-lock" class="umb-group-builder__property-tag-icon"></umb-icon>
+        <localize key="contentTypeEditor_isSensitiveData">Is sensitive data</localize>
+      </div>
+
+      <div class="umb-group-builder__property-tag -white" ng-if="vm.property.allowCultureVariant">
+        <umb-icon icon="icon-shuffle" class="umb-group-builder__property-tag-icon"></umb-icon>
+        <localize key="contentTypeEditor_cultureVariantLabel">Vary by culture</localize>
+      </div>
+
+      <div class="umb-group-builder__property-tag -white" ng-if="vm.property.allowSegmentVariant">
+        <umb-icon icon="icon-shuffle" class="umb-group-builder__property-tag-icon"></umb-icon>
+        <localize key="contentTypeEditor_segmentVariantLabel">Vary by segments</localize>
+      </div>
+
+    </div>
+
+    <div class="umb-group-builder__property-tags -right">
+      <div class="umb-group-builder__property-tag" ng-if="vm.property.inherited">
+        <umb-icon icon="icon-merge" class="umb-group-builder__property-tag-icon"></umb-icon>
+        <span style="margin-right: 3px"><localize key="contentTypeEditor_inheritedFrom">Inherited from</localize></span>
+        <button type="button" class="btn btn-small btn-link p0" ng-click="vm.clickComposition(vm.property.contentTypeId)">
+          {{vm.property.contentTypeName}}
+        </button>
+      </div>
+
+      <div class="umb-group-builder__property-tag" ng-if="vm.property.locked">
+        <umb-icon icon="icon-lock" class="umb-group-builder__property-tag-icon"></umb-icon>
+        <localize key="general_locked">Locked</localize>
+      </div>
+    </div>
+
+    <ng-form inert class="umb-group-builder__property-preview-form" name="propertyEditorPreviewForm" umb-disable-form-validation ng-click="vm.edit()" tabindex="-1">
+      <umb-property-editor ng-if="vm.property.view !== undefined"
+                           model="vm.property"
+                           preview="true">
+      </umb-property-editor>
+    </ng-form>
+
+    <button type="button" aria-label="Open settings" class="umb-group-builder__open-settings" ng-if="!vm.property.inherited && !vm.property.locked" ng-click="vm.edit()"></button>
 
   </div>
 
   <!-- row tools -->
   <div class="umb-group-builder__property-actions" ng-if="!vm.sortable">
 
-      <div ng-if="!vm.property.inherited">
-
-          <!-- settings for property -->
-          <div class="umb-group-builder__property-action">
-              <button type="button" aria-label="Open settings" class="btn-icon" ng-click="vm.edit()" localize="title" title="@general_edit">
-                  <umb-icon icon="icon-settings"></umb-icon>
-              </button>
-          </div>
-
-          <!-- delete property -->
-          <div ng-if="!vm.property.locked" class="umb-group-builder__property-action">
-              <button type="button" aria-label="Delete property" class="btn-icon" ng-click="vm.remove()">
-                  <umb-icon icon="icon-trash"></umb-icon>
-              </button>
-          </div>
+    <div ng-if="!vm.property.inherited">
 
+      <!-- settings for property -->
+      <div class="umb-group-builder__property-action">
+        <button type="button" aria-label="Open settings" class="btn-icon" ng-click="vm.edit()" localize="title" title="@general_edit">
+          <umb-icon icon="icon-settings"></umb-icon>
+        </button>
       </div>
 
+      <!-- delete property -->
+      <div ng-if="!vm.property.locked" class="umb-group-builder__property-action">
+        <button type="button" aria-label="Delete property" class="btn-icon" ng-click="vm.remove()">
+          <umb-icon icon="icon-trash"></umb-icon>
+        </button>
+      </div>
+
+    </div>
+
   </div>
 
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html
index 3575453bd8..c35e1ee45a 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html
@@ -22,7 +22,7 @@
                             tab="tab"
                             is-open="tab.alias === openTabAlias"
                             on-click="changeTab(tab)"
-                            on-click-composition="openDocumentType(documentTypeId)"
+                            on-click-composition="openContentType(contentTypeId)"
                             sorting="sortingMode"
                             allow-remove="canRemoveTab(tab) && !sortingMode"
                             on-remove="removeTab(tab, tabIndex)"
@@ -105,6 +105,7 @@
                         sortable="sortingMode"
                         on-edit="editPropertyTypeSettings(property)"
                         on-remove="deleteProperty(tab.properties, property)"
+                        on-click-composition="openContentType(contentTypeId)"
                         val-server-field-alias="{{'Groups[' + tab.serverValidationIndex + '].Properties[' + propertyIndex + '].Alias'}}"
                         val-server-field-label="{{'Groups[' + tab.serverValidationIndex + '].Properties[' + propertyIndex + '].Label'}}"
                         on-change-sort-order-value="onChangePropertySortOrderValue(tab)"
@@ -143,7 +144,7 @@
                 allow-name="true"
                 group="group"
                 allow-remove="canRemoveGroup(group) && !sortingMode"
-                on-click-composition="openDocumentType(documentTypeId)"
+                on-click-composition="openContentType(contentTypeId)"
                 on-remove="removeGroup(group)"
                 on-update-name="onChangeGroupName(group)"
                 sorting="sortingMode"
@@ -159,6 +160,7 @@
                             sortable="sortingMode"
                             on-edit="editPropertyTypeSettings(property)"
                             on-remove="deleteProperty(group.properties, property)"
+                            on-click-composition="openContentType(contentTypeId)"
                             on-change-sort-order-value="onChangePropertySortOrderValue(group)"
                             val-server-field-alias="{{'Groups[' + group.serverValidationIndex + '].Properties[' + propertyIndex + '].Alias'}}"
                             val-server-field-label="{{'Groups[' + group.serverValidationIndex + '].Properties[' + propertyIndex + '].Label'}}"