diff --git a/frontend/src/Editor/DragContainer.jsx b/frontend/src/Editor/DragContainer.jsx
index 389be4a8c9..7d1b6fbfe5 100644
--- a/frontend/src/Editor/DragContainer.jsx
+++ b/frontend/src/Editor/DragContainer.jsx
@@ -30,7 +30,6 @@ export default function DragContainer({
     parent: box?.component?.parent,
   }));
   const [list, setList] = useState(boxList);
-  console.log('>>>>>>>>>>>>>> Rerender');
 
   const hoveredComponent = useEditorStore((state) => state?.hoveredComponent, shallow);
 
@@ -40,9 +39,12 @@ export default function DragContainer({
   }, [selectedComponents.length, JSON.stringify(boxes)]);
 
   useEffect(() => {
-    moveableRef.current.updateRect();
-    moveableRef.current.updateTarget();
-    moveableRef.current.updateSelectors();
+    setList(boxList);
+    setTimeout(() => {
+      moveableRef.current.updateRect();
+      moveableRef.current.updateTarget();
+      moveableRef.current.updateSelectors();
+    }, 100);
   }, [currentLayout]);
 
   useEffect(() => {
@@ -54,7 +56,6 @@ export default function DragContainer({
   const getDimensions = (id) => {
     const box = boxes.find((b) => b.id === id);
     const layoutData = box?.layouts?.[currentLayout];
-    console.log('layoutData -->', layoutData);
     if (isEmpty(layoutData)) {
       return {};
     }
@@ -69,21 +70,15 @@ export default function DragContainer({
   };
 
   const groupedTargets = [...selectedComponents.map((component) => '.ele-' + component.id)];
-  console.log('selectedComponents', selectedComponents);
   const movableTargets = [groupedTargets];
-  console.log('selectedComponents movableTargets', movableTargets);
-  console.log('selectedComponents hoveredComponent', hoveredComponent);
   if (hoveredComponent && groupedTargets?.length <= 1) {
     movableTargets.push('.ele-' + hoveredComponent);
   }
 
-  console.log('selectedComponents draggedTarget', draggedTarget);
   if (draggedTarget && !movableTargets.includes(`.ele-${draggedTarget}`)) {
     movableTargets.push('.ele-' + draggedTarget);
   }
 
-  console.log('selectedComponents movableTargets', movableTargets, isChildDragged);
-
   //   console.log("movableTargets", movableTargets, hoveredComponent);
 
   return (
diff --git a/frontend/src/Editor/gridUtils.js b/frontend/src/Editor/gridUtils.js
index 548d3678fd..aae90d3804 100644
--- a/frontend/src/Editor/gridUtils.js
+++ b/frontend/src/Editor/gridUtils.js
@@ -1,4 +1,5 @@
 export function correctBounds(layout, bounds) {
+  layout = scaleLayouts(layout);
   const collidesWith = [];
   for (let i = 0, len = layout.length; i < len; i++) {
     const l = layout[i];
@@ -18,7 +19,18 @@ export function correctBounds(layout, bounds) {
       }
     }
   }
-  return layout;
+  return removePaddingLeft(layout);
+}
+
+function removePaddingLeft(layouts) {
+  return layouts.map((layout) => {
+    if (layout.left == 1) {
+      if (!layouts.find((l) => l.top > layout.top && l.top < layout.top + layout.height && l.left < 1)) {
+        return { ...layout, left: 0 };
+      }
+    }
+    return { ...layout };
+  });
 }
 
 function collides(l1, l2) {
@@ -212,3 +224,10 @@ function sortLayoutItemsByRowCol(layout) {
     return -1;
   });
 }
+
+function scaleLayouts(layouts, cols = 6) {
+  return layouts.map((layout) => ({
+    ...layout,
+    width: layout.width <= 4 ? 2 : layout.width,
+  }));
+}