diff --git a/libs/shared/lib/components/Popup.tsx b/libs/shared/lib/components/Popup.tsx
index a25f44e5451c931a8feabd58ec0ff74e24d367db..c3c0571cab2079e65e52831ee34eab0450a0edf8 100644
--- a/libs/shared/lib/components/Popup.tsx
+++ b/libs/shared/lib/components/Popup.tsx
@@ -1,10 +1,13 @@
 import { useState } from 'react';
 
-export const Popup = (props: { children: React.ReactNode; open: boolean; vanchor: 'left' | 'right' }) => {
+export const Popup = (props: { children: React.ReactNode; open: boolean; hAnchor: 'left' | 'right' }) => {
   return (
     <>
       {props.open && (
-        <div className={`absolute ${props.vanchor}-20 z-10 max-w-[20rem] bg-offwhite-100 flex flex-col gap-2 animate-openmenu`}>
+        <div
+          className="absolute z-10 max-w-[20rem] bg-offwhite-100 flex flex-col gap-2 animate-openmenu"
+          style={props.hAnchor === 'left' ? { left: '5rem' } : { right: '5rem' }}
+        >
           {props.children}
         </div>
       )}
diff --git a/libs/shared/lib/querybuilder/panel/querybuilder.tsx b/libs/shared/lib/querybuilder/panel/querybuilder.tsx
index 912712627b3514c3e048538c22d497117f526300..09945f312e2aaf31fa7793db8f4aae1a354517e9 100644
--- a/libs/shared/lib/querybuilder/panel/querybuilder.tsx
+++ b/libs/shared/lib/querybuilder/panel/querybuilder.tsx
@@ -450,7 +450,7 @@ export const QueryBuilderInner = (props: QueryBuilderProps) => {
           onDrag={() => {}}
         />
       </Dialog>
-      <Popup open={openMLDialog} vanchor="right">
+      <Popup open={openMLDialog} hAnchor="right">
         <QueryBuilderMLPanel />
       </Popup>
       <ReactFlow