diff --git a/front/components/Editor/Extensions/Image/ImageBlock.ts b/front/components/Editor/Extensions/Image/ImageBlock.ts
index c540ae52..db1b58f2 100644
--- a/front/components/Editor/Extensions/Image/ImageBlock.ts
+++ b/front/components/Editor/Extensions/Image/ImageBlock.ts
@@ -16,7 +16,6 @@ export default Node.create({
       },
       size: {
         width: 300,
-        height: 200,
       },
     };
   },
diff --git a/front/components/Editor/Extensions/Image/ImageBlockComponent.tsx b/front/components/Editor/Extensions/Image/ImageBlockComponent.tsx
index ccafb4af..0751e19c 100644
--- a/front/components/Editor/Extensions/Image/ImageBlockComponent.tsx
+++ b/front/components/Editor/Extensions/Image/ImageBlockComponent.tsx
@@ -12,7 +12,7 @@ function ImageBlockComponent(props: any) {
   const [image, setImage] = React.useState(null);
   const [isLoading, setIsLoading] = React.useState(false);
   const [blockObject, setblockObject] = React.useState(props.node.attrs.blockObject);
-  const [imageSize, setImageSize] = React.useState({ width: 0, height: 0 });
+  const [imageSize, setImageSize] = React.useState({ width: props.node.attrs.size ? props.node.attrs.size.width : 300 });
 
   const handleImageChange = (event: React.ChangeEvent<any>) => {
     setImage(event.target.files[0]);
@@ -30,6 +30,11 @@ function ImageBlockComponent(props: any) {
     });
   };
 
+  console.log(props.node.attrs);
+  console.log(imageSize);
+
+
+
   return (
     <NodeViewWrapper className="block-image">
       {!blockObject && (
@@ -44,44 +49,45 @@ function ImageBlockComponent(props: any) {
         </BlockImageWrapper>
       )}
       {blockObject && (
-        <BlockImageGlobal>
-          <Resizable defaultSize={{ width: blockObject.width, height: blockObject.height }}
-            handleStyles={{
-              right: { width: '10px', height: '100%', cursor: 'col-resize' },
-              top: { width: 0 },
-              bottom: { width: 0 },
-              left: { width: 0 },
-              topRight: { width: 0 },
-              bottomRight: { width: 0 },
-              bottomLeft: { width: 0 },
-              topLeft: { width: 0 },
+        <Resizable defaultSize={{ width: imageSize.width, height: "100%" }}
+          handleStyles={{
+            right: { width: '10px', height: '100%', cursor: 'col-resize' },
+            top: { width: 0 },
+            bottom: { width: 0 },
+            left: { width: 0 },
+            topRight: { width: 0 },
+            bottomRight: { width: 0 },
+            bottomLeft: { width: 0 },
+            topLeft: { width: 0 },
 
-            }}
-            style={{ margin: "auto" }}
-            onResizeStop={(e, direction, ref, d) => {
-              props.updateAttributes({
-                blockObject: {
-                  ...blockObject,
-                  width: imageSize.width + d.width,
-                  height: imageSize.height + d.height,
-                },
-              });
-            }}
-          >
+          }}
+          style={{ margin: "auto" }}
+          maxWidth={850}
+          minWidth={400}
+          onResizeStop={(e, direction, ref, d) => {
+            props.updateAttributes({
+              size: {
+                width: imageSize.width + d.width,
+              }
+            });
+            setImageSize({
+              width: imageSize.width + d.width,
+            });
+          }}
+        >
 
-            <BlockImage>
-              <AspectRatio.Root ratio={16 / 9}>
-                <img
-                  src={`${getBackendUrl()}content/uploads/files/activities/${props.extension.options.activity.activity_id}/blocks/imageBlock/${blockObject.block_id}/${blockObject.block_data.file_id}.${blockObject.block_data.file_format
-                    }`}
-                  alt=""
-                />
-              </AspectRatio.Root>
+          <BlockImage>
+            <AspectRatio.Root ratio={16 / 9}>
+              <img
+                src={`${getBackendUrl()}content/uploads/files/activities/${props.extension.options.activity.activity_id}/blocks/imageBlock/${blockObject.block_id}/${blockObject.block_data.file_id}.${blockObject.block_data.file_format
+                  }`}
+                alt=""
+              />
+            </AspectRatio.Root>
 
 
-            </BlockImage>
-          </Resizable>
-        </BlockImageGlobal>
+          </BlockImage>
+        </Resizable>
       )}
       {isLoading && (
         <div>
@@ -112,6 +118,7 @@ const BlockImageWrapper = styled.div`
 
 const BlockImage = styled.div`
   display: flex;
+  
 
   // center
   align-items: center;
@@ -128,9 +135,3 @@ const BlockImage = styled.div`
   }
   
 `;
-
-const BlockImageGlobal = styled.div`
-
-  
-  `;
-const ImageNotFound = styled.div``;