diff --git a/web/src/lib/components/shared-components/profile-image-cropper.svelte b/web/src/lib/components/shared-components/profile-image-cropper.svelte
index 5109deefa3..cd0e917d51 100644
--- a/web/src/lib/components/shared-components/profile-image-cropper.svelte
+++ b/web/src/lib/components/shared-components/profile-image-cropper.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
   import { AssetResponseDto, api } from '@api';
-  import { createEventDispatcher } from 'svelte';
+  import { createEventDispatcher, onMount } from 'svelte';
   import { notificationController, NotificationType } from './notification/notification';
   import { handleError } from '$lib/utils/handle-error';
   import domtoimage from 'dom-to-image';
@@ -13,6 +13,10 @@
   const dispatch = createEventDispatcher();
   let imgElement: HTMLDivElement;
 
+  onMount(() => {
+    imgElement.style.width = '100%';
+  });
+
   const hasTransparentPixels = async (blob: Blob) => {
     const img = new Image();
     img.src = URL.createObjectURL(blob);