diff --git a/docs/core/services/process-content.service.md b/docs/core/services/process-content.service.md
index df09795d8d..e614f4b85b 100644
--- a/docs/core/services/process-content.service.md
+++ b/docs/core/services/process-content.service.md
@@ -84,7 +84,7 @@ Associate an uploaded file with a Process Instance.
 Let's say we have an upload button as follows: 
 
 ```html
-  <div class="button-row">
+  <div>
     <button mat-button color="accent" mat-mini-fab (click)="fileInput.click()">
       <mat-icon>attachment</mat-icon>
     </button>
diff --git a/lib/content-services/upload/components/upload-button.component.html b/lib/content-services/upload/components/upload-button.component.html
index b28241ae9a..96bfcf17cc 100644
--- a/lib/content-services/upload/components/upload-button.component.html
+++ b/lib/content-services/upload/components/upload-button.component.html
@@ -1,21 +1,41 @@
 <form class="adf-upload-button-file-container">
     <!--Files Upload-->
-    <a *ngIf="!uploadFolders"
-        [disabled]="isButtonDisabled()"
-        mat-raised-button color="primary">
-        <mat-icon>file_upload</mat-icon>
+    <div *ngIf="!uploadFolders">
+
+        <!--Single Files Upload-->
+        <button *ngIf="!multipleFiles"
+            [disabled]="isButtonDisabled()"
+            mat-raised-button color="primary"
+            (click)="uploadSingleFile.click()">
+            <mat-icon>file_upload</mat-icon>
+            <span id="upload-single-file-label"
+                *ngIf="!staticTitle">{{ 'FILE_UPLOAD.BUTTON.UPLOAD_FILE' | translate }}</span>
+            <span id="upload-single-file-label-static"
+                *ngIf="staticTitle">{{ staticTitle }}</span>
+            <input #uploadSingleFile
+                id="upload-single-file"
+                data-automation-id="upload-single-file"
+                type="file"
+                name="uploadFiles"
+                accept="{{acceptedFilesType}}"
+                [attr.disabled]="isButtonDisabled()"
+                [title]="tooltip"
+                (change)="onFilesAdded($event)">
+        </button>
 
         <!--Multiple Files Upload-->
-        <span *ngIf="multipleFiles">
-            <label
-                id="upload-multiple-file-label"
-                *ngIf="!staticTitle"
-                for="upload-multiple-files">{{ 'FILE_UPLOAD.BUTTON.UPLOAD_FILE' | translate }}</label>
-            <label
+        <button *ngIf="multipleFiles"
+            [disabled]="isButtonDisabled()"
+            mat-raised-button color="primary"
+            (click)="uploadMultipleFiles.click()">
+            <mat-icon>file_upload</mat-icon>
+
+            <span id="upload-multiple-file-label"
+                *ngIf="!staticTitle">{{ 'FILE_UPLOAD.BUTTON.UPLOAD_FILE' | translate }}</span>
+            <span
                 id="upload-multiple-file-label-static"
-                *ngIf="staticTitle"
-                for="upload-multiple-files">{{ staticTitle }}</label>
-            <input #uploadFiles
+                *ngIf="staticTitle">{{ staticTitle }}</span>
+            <input #uploadMultipleFiles
                 id="upload-multiple-files"
                 data-automation-id="upload-multiple-files"
                 type="file"
@@ -25,52 +45,31 @@
                 [attr.disabled]="isButtonDisabled()"
                 [title]="tooltip"
                 (change)="onFilesAdded($event)">
-        </span>
-
-        <!--Single Files Upload-->
-        <span *ngIf="!multipleFiles">
-            <label
-                id="upload-single-file-label"
-                *ngIf="!staticTitle"
-                for="upload-single-file">{{ 'FILE_UPLOAD.BUTTON.UPLOAD_FILE' | translate }}</label>
-            <label
-                id="upload-single-file-label-static"
-                *ngIf="staticTitle"
-                for="upload-single-file">{{ staticTitle }}</label>
-            <input #uploadFiles
-                id="upload-single-file"
-                data-automation-id="upload-single-file"
-                type="file"
-                name="uploadFiles"
-                accept="{{acceptedFilesType}}"
-                [attr.disabled]="isButtonDisabled()"
-                [title]="tooltip"
-                (change)="onFilesAdded($event)">
-        </span>
-    </a>
+        </button>
+    </div>
 
     <!--Folders Upload-->
-    <a *ngIf="uploadFolders"
-        [disabled]="isButtonDisabled()" mat-raised-button color="primary">
-        <mat-icon>file_upload</mat-icon>
-        <label
-            id="uploadFolder-label"
-            *ngIf="!staticTitle"
-            for="uploadFolder">{{ 'FILE_UPLOAD.BUTTON.UPLOAD_FOLDER' | translate }}</label>
-        <label
-            id="uploadFolder-label-static"
-            *ngIf="staticTitle"
-            for="uploadFolder">{{ staticTitle }}</label>
-        <input #uploadFolders
-            id="uploadFolder"
-            data-automation-id="uploadFolder"
-            type="file"
-            name="uploadFiles"
-            multiple="multiple"
-            accept="{{acceptedFilesType}}"
-            webkitdirectory directory
-            [attr.disabled]="isButtonDisabled()"
-            [title]="tooltip"
-            (change)="onDirectoryAdded($event)">
-    </a>
+    <div *ngIf="uploadFolders">
+        <button
+            [disabled]="isButtonDisabled()"
+            mat-raised-button color="primary"
+            (click)="uploadFolders.click()">
+            <mat-icon>file_upload</mat-icon>
+            <span id="uploadFolder-label"
+                *ngIf="!staticTitle">{{ 'FILE_UPLOAD.BUTTON.UPLOAD_FOLDER' | translate }}</span>
+            <span id="uploadFolder-label-static"
+                *ngIf="staticTitle">{{ staticTitle }}</span>
+            <input #uploadFolders
+                id="uploadFolder"
+                data-automation-id="uploadFolder"
+                type="file"
+                name="uploadFiles"
+                multiple="multiple"
+                accept="{{acceptedFilesType}}"
+                webkitdirectory directory
+                [attr.disabled]="isButtonDisabled()"
+                [title]="tooltip"
+                (change)="onDirectoryAdded($event)">
+        </button>
+    </div>
 </form>
diff --git a/lib/content-services/upload/components/upload-button.component.scss b/lib/content-services/upload/components/upload-button.component.scss
index a5bd6f3d7e..402c618aa3 100644
--- a/lib/content-services/upload/components/upload-button.component.scss
+++ b/lib/content-services/upload/components/upload-button.component.scss
@@ -1,12 +1,5 @@
 .adf {
     &-upload-button-file-container input {
-        cursor: pointer;
-        height: 100%;
-        right: 0;
-        opacity: 0;
-        position: absolute;
-        top: 0;
-        width: 300px;
-        z-index: 4;
+        display: none;
     }
 }
diff --git a/lib/core/form/components/widgets/upload/upload.widget.html b/lib/core/form/components/widgets/upload/upload.widget.html
index 1e8b6a207f..ca5153adb8 100644
--- a/lib/core/form/components/widgets/upload/upload.widget.html
+++ b/lib/core/form/components/widgets/upload/upload.widget.html
@@ -24,15 +24,15 @@
             </mat-list>
         </div>
 
-        <div class="button-row" *ngIf="(!hasFile || multipleOption) && !field.readOnly">
-            <a mat-raised-button color="primary">
+        <div *ngIf="(!hasFile || multipleOption) && !field.readOnly">
+            <button mat-raised-button color="primary" (click)="uploadFiles.click()">
                 {{ 'FORM.FIELD.UPLOAD' | translate }}<mat-icon>file_upload</mat-icon>
                 <input #uploadFiles
                        [multiple]="multipleOption"
                        type="file"
                        [id]="field.id"
                        (change)="onFileChanged($event)"/>
-            </a>
+            </button>
         </div>
     </div>
     <error-widget [error]="field.validationSummary"></error-widget>
diff --git a/lib/core/form/components/widgets/upload/upload.widget.scss b/lib/core/form/components/widgets/upload/upload.widget.scss
index 43e97b0e3f..a177c72d67 100644
--- a/lib/core/form/components/widgets/upload/upload.widget.scss
+++ b/lib/core/form/components/widgets/upload/upload.widget.scss
@@ -6,14 +6,7 @@
         margin-bottom: 15px;
 
         input {
-            cursor: pointer;
-            height: 100%;
-            right: 0;
-            opacity: 0;
-            position: absolute;
-            top: 0;
-            width: 300px;
-            z-index: 4;
+            display: none;
         }
     }
 
diff --git a/lib/process-services-cloud/src/lib/form/components/upload-cloud.widget.html b/lib/process-services-cloud/src/lib/form/components/upload-cloud.widget.html
index 2bfe986a4f..90b8ce3092 100644
--- a/lib/process-services-cloud/src/lib/form/components/upload-cloud.widget.html
+++ b/lib/process-services-cloud/src/lib/form/components/upload-cloud.widget.html
@@ -24,15 +24,15 @@
             </mat-list>
         </div>
 
-        <div class="button-row" *ngIf="(!hasFile || multipleOption) && !field.readOnly">
-            <a mat-raised-button color="primary">
+        <div *ngIf="(!hasFile || multipleOption) && !field.readOnly">
+            <button mat-raised-button color="primary" (click)="uploadFiles.click()">
                 {{ 'FORM.FIELD.UPLOAD' | translate }}<mat-icon>file_upload</mat-icon>
                 <input #uploadFiles
                        [multiple]="multipleOption"
                        type="file"
                        [id]="field.id"
                        (change)="onFileChanged($event)"/>
-            </a>
+            </button>
         </div>
     </div>
     <error-widget [error]="field.validationSummary"></error-widget>
diff --git a/lib/process-services-cloud/src/lib/form/components/upload-cloud.widget.scss b/lib/process-services-cloud/src/lib/form/components/upload-cloud.widget.scss
index 80365289e4..983f3577e8 100644
--- a/lib/process-services-cloud/src/lib/form/components/upload-cloud.widget.scss
+++ b/lib/process-services-cloud/src/lib/form/components/upload-cloud.widget.scss
@@ -1,18 +1,10 @@
-
 .adf-cloud {
 
     &-upload-widget-container {
         margin-bottom: 15px;
 
         input {
-            cursor: pointer;
-            height: 100%;
-            right: 0;
-            opacity: 0;
-            position: absolute;
-            top: 0;
-            width: 300px;
-            z-index: 4;
+            display: none;
         }
     }
 
diff --git a/lib/process-services/content-widget/attach-folder-widget.component.html b/lib/process-services/content-widget/attach-folder-widget.component.html
index 9d67f76422..390645a167 100644
--- a/lib/process-services/content-widget/attach-folder-widget.component.html
+++ b/lib/process-services/content-widget/attach-folder-widget.component.html
@@ -15,7 +15,7 @@
             </div>
         </div>
 
-        <div class="button-row" *ngIf="!hasFolder && !field.readOnly">
+        <div *ngIf="!hasFolder && !field.readOnly">
             <button mat-raised-button
                 color="primary"
                 (click)="openSelectDialogFromFileSource()"