diff --git a/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageViewer.tsx b/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageViewer.tsx
index 874464f938..949e72fad1 100644
--- a/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageViewer.tsx
+++ b/invokeai/frontend/web/src/features/gallery/components/ImageViewer/ImageViewer.tsx
@@ -42,8 +42,9 @@ export const ImageViewer = memo(() => {
   useHotkeys('z', onToggle, { enabled: isViewerEnabled }, [isViewerEnabled, onToggle]);
   useHotkeys('esc', onClose, { enabled: isViewerEnabled }, [isViewerEnabled, onClose]);
 
+  // The AnimatePresence mode must be wait - else framer can get confused if you spam the toggle button
   return (
-    <AnimatePresence>
+    <AnimatePresence mode="wait">
       {shouldShowViewer && (
         <Flex
           key="imageViewer"
diff --git a/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx b/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx
index 5e37a2d8c8..42df03872c 100644
--- a/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx
+++ b/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx
@@ -254,11 +254,11 @@ const InvokeTabs = () => {
             />
           </>
         )}
-        <Panel style={{ position: 'relative' }} id="main-panel" order={1} minSize={20}>
-          <TabPanels w="full" h="full">
+        <Panel id="main-panel" order={1} minSize={20}>
+          <TabPanels w="full" h="full" position="relative">
             {tabPanels}
+            <ImageViewer />
           </TabPanels>
-          <ImageViewer />
         </Panel>
         {shouldShowGalleryPanel && (
           <>