diff --git a/invokeai/frontend/web/src/features/controlAdapters/components/ControlAdapterImagePreview.tsx b/invokeai/frontend/web/src/features/controlAdapters/components/ControlAdapterImagePreview.tsx
index b585bd1d57..6caf46d0b4 100644
--- a/invokeai/frontend/web/src/features/controlAdapters/components/ControlAdapterImagePreview.tsx
+++ b/invokeai/frontend/web/src/features/controlAdapters/components/ControlAdapterImagePreview.tsx
@@ -184,23 +184,25 @@ const ControlAdapterImagePreview = ({ isSmall, id }: Props) => {
         />
       </Box>
 
-      <Flex flexDir="column" top={1} insetInlineEnd={1}>
-        <IAIDndImageIcon
-          onClick={handleResetControlImage}
-          icon={controlImage ? <PiArrowCounterClockwiseBold size={16} /> : undefined}
-          tooltip={t('controlnet.resetControlImage')}
-        />
-        <IAIDndImageIcon
-          onClick={handleSaveControlImage}
-          icon={controlImage ? <PiFloppyDiskBold size={16} /> : undefined}
-          tooltip={t('controlnet.saveControlImage')}
-        />
-        <IAIDndImageIcon
-          onClick={handleSetControlImageToDimensions}
-          icon={controlImage ? <PiRulerBold size={16} /> : undefined}
-          tooltip={t('controlnet.setControlImageDimensions')}
-        />
-      </Flex>
+      {controlImage && (
+        <Flex position="absolute" flexDir="column" top={1} insetInlineEnd={1} gap={1}>
+          <IAIDndImageIcon
+            onClick={handleResetControlImage}
+            icon={<PiArrowCounterClockwiseBold size={16} />}
+            tooltip={t('controlnet.resetControlImage')}
+          />
+          <IAIDndImageIcon
+            onClick={handleSaveControlImage}
+            icon={<PiFloppyDiskBold size={16} />}
+            tooltip={t('controlnet.saveControlImage')}
+          />
+          <IAIDndImageIcon
+            onClick={handleSetControlImageToDimensions}
+            icon={<PiRulerBold size={16} />}
+            tooltip={t('controlnet.setControlImageDimensions')}
+          />
+        </Flex>
+      )}
 
       {pendingControlImages.includes(id) && (
         <Flex
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/ControlAndIPAdapter/ControlAdapterImagePreview.tsx b/invokeai/frontend/web/src/features/controlLayers/components/ControlAndIPAdapter/ControlAdapterImagePreview.tsx
index fe9096d72c..e840885050 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/ControlAndIPAdapter/ControlAdapterImagePreview.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/ControlAndIPAdapter/ControlAdapterImagePreview.tsx
@@ -159,7 +159,7 @@ export const ControlAdapterImagePreview = memo(
         onMouseEnter={handleMouseEnter}
         onMouseLeave={handleMouseLeave}
         position="relative"
-        w="full"
+        w={36}
         h={36}
         alignItems="center"
         justifyContent="center"
@@ -192,25 +192,27 @@ export const ControlAdapterImagePreview = memo(
           />
         </Box>
 
-        <>
-          <IAIDndImageIcon
-            onClick={handleResetControlImage}
-            icon={controlImage ? <PiArrowCounterClockwiseBold size={16} /> : undefined}
-            tooltip={t('controlnet.resetControlImage')}
-          />
-          <IAIDndImageIcon
-            onClick={handleSaveControlImage}
-            icon={controlImage ? <PiFloppyDiskBold size={16} /> : undefined}
-            tooltip={t('controlnet.saveControlImage')}
-            mt={6}
-          />
-          <IAIDndImageIcon
-            onClick={handleSetControlImageToDimensions}
-            icon={controlImage ? <PiRulerBold size={16} /> : undefined}
-            tooltip={shift ? t('controlnet.setControlImageDimensionsForce') : t('controlnet.setControlImageDimensions')}
-            mt={12}
-          />
-        </>
+        {controlImage && (
+          <Flex position="absolute" flexDir="column" top={1} insetInlineEnd={1} gap={1}>
+            <IAIDndImageIcon
+              onClick={handleResetControlImage}
+              icon={<PiArrowCounterClockwiseBold size={16} />}
+              tooltip={t('controlnet.resetControlImage')}
+            />
+            <IAIDndImageIcon
+              onClick={handleSaveControlImage}
+              icon={<PiFloppyDiskBold size={16} />}
+              tooltip={t('controlnet.saveControlImage')}
+            />
+            <IAIDndImageIcon
+              onClick={handleSetControlImageToDimensions}
+              icon={<PiRulerBold size={16} />}
+              tooltip={
+                shift ? t('controlnet.setControlImageDimensionsForce') : t('controlnet.setControlImageDimensions')
+              }
+            />
+          </Flex>
+        )}
 
         {controlAdapter.processorPendingBatchId !== null && (
           <Flex
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/ControlAndIPAdapter/IPAdapterImagePreview.tsx b/invokeai/frontend/web/src/features/controlLayers/components/ControlAndIPAdapter/IPAdapterImagePreview.tsx
index da93ccef09..ed60951513 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/ControlAndIPAdapter/IPAdapterImagePreview.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/ControlAndIPAdapter/IPAdapterImagePreview.tsx
@@ -81,7 +81,7 @@ export const IPAdapterImagePreview = memo(
     }, [handleResetControlImage, isConnected, isErrorControlImage]);
 
     return (
-      <Flex position="relative" w="full" h={36} alignItems="center" justifyContent="center">
+      <Flex position="relative" w={36} h={36} alignItems="center">
         <IAIDndImage
           draggableData={draggableData}
           droppableData={droppableData}
@@ -89,19 +89,22 @@ export const IPAdapterImagePreview = memo(
           postUploadAction={postUploadAction}
         />
 
-        <>
-          <IAIDndImageIcon
-            onClick={handleResetControlImage}
-            icon={controlImage ? <PiArrowCounterClockwiseBold size={16} /> : undefined}
-            tooltip={t('controlnet.resetControlImage')}
-          />
-          <IAIDndImageIcon
-            onClick={handleSetControlImageToDimensions}
-            icon={controlImage ? <PiRulerBold size={16} /> : undefined}
-            tooltip={shift ? t('controlnet.setControlImageDimensionsForce') : t('controlnet.setControlImageDimensions')}
-            mt={6}
-          />
-        </>
+        {controlImage && (
+          <Flex position="absolute" flexDir="column" top={1} insetInlineEnd={1} gap={1}>
+            <IAIDndImageIcon
+              onClick={handleResetControlImage}
+              icon={<PiArrowCounterClockwiseBold size={16} />}
+              tooltip={t('controlnet.resetControlImage')}
+            />
+            <IAIDndImageIcon
+              onClick={handleSetControlImageToDimensions}
+              icon={<PiRulerBold size={16} />}
+              tooltip={
+                shift ? t('controlnet.setControlImageDimensionsForce') : t('controlnet.setControlImageDimensions')
+              }
+            />
+          </Flex>
+        )}
       </Flex>
     );
   }
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/IILayer/InitialImagePreview.tsx b/invokeai/frontend/web/src/features/controlLayers/components/IILayer/InitialImagePreview.tsx
index ee62dcbcdd..0a9157068d 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/IILayer/InitialImagePreview.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/IILayer/InitialImagePreview.tsx
@@ -78,27 +78,32 @@ export const InitialImagePreview = memo(({ image, onChangeImage, droppableData,
   }, [onReset, isConnected, isErrorControlImage]);
 
   return (
-    <Flex position="relative" w="full" h={36} alignItems="center" justifyContent="center">
-      <IAIDndImage
-        draggableData={draggableData}
-        droppableData={droppableData}
-        imageDTO={imageDTO}
-        postUploadAction={postUploadAction}
-      />
+    <Flex w="full" alignItems="center" justifyContent="center">
+      <Flex position="relative" w={36} h={36} alignItems="center" justifyContent="center">
+        <IAIDndImage
+          draggableData={draggableData}
+          droppableData={droppableData}
+          imageDTO={imageDTO}
+          postUploadAction={postUploadAction}
+        />
 
-      <>
-        <IAIDndImageIcon
-          onClick={onReset}
-          icon={imageDTO ? <PiArrowCounterClockwiseBold size={16} /> : undefined}
-          tooltip={t('controlnet.resetControlImage')}
-        />
-        <IAIDndImageIcon
-          onClick={onUseSize}
-          icon={imageDTO ? <PiRulerBold size={16} /> : undefined}
-          tooltip={shift ? t('controlnet.setControlImageDimensionsForce') : t('controlnet.setControlImageDimensions')}
-          mt={6}
-        />
-      </>
+        {imageDTO && (
+          <Flex position="absolute" flexDir="column" top={1} insetInlineEnd={1} gap={1}>
+            <IAIDndImageIcon
+              onClick={onReset}
+              icon={<PiArrowCounterClockwiseBold size={16} />}
+              tooltip={t('controlnet.resetControlImage')}
+            />
+            <IAIDndImageIcon
+              onClick={onUseSize}
+              icon={<PiRulerBold size={16} />}
+              tooltip={
+                shift ? t('controlnet.setControlImageDimensionsForce') : t('controlnet.setControlImageDimensions')
+              }
+            />
+          </Flex>
+        )}
+      </Flex>
     </Flex>
   );
 });