diff --git a/src/components/InteractionMapMachineProvider.tsx b/src/components/InteractionMapMachineProvider.tsx
index 55ae46f19..17c304eff 100644
--- a/src/components/InteractionMapMachineProvider.tsx
+++ b/src/components/InteractionMapMachineProvider.tsx
@@ -186,9 +186,10 @@ export function InteractionMapMachineProvider({
       if (
         event.BUBBLING_PHASE &&
         !(
-          event instanceof MouseEvent &&
-          event.target instanceof HTMLElement &&
-          ['INPUT', 'BUTTON', 'ANCHOR'].includes(event.target.tagName)
+          (event.target instanceof HTMLElement &&
+            ['INPUT', 'BUTTON', 'ANCHOR'].includes(event.target.tagName)) ||
+          (event.target as HTMLElement).getAttribute('contenteditable') ===
+            'true'
         )
       ) {
         send({ type: 'Fire event', data: event })
diff --git a/src/index.css b/src/index.css
index 08b136aa8..bd987fddf 100644
--- a/src/index.css
+++ b/src/index.css
@@ -96,6 +96,11 @@ button:disabled {
   @apply bg-chalkboard-90 text-chalkboard-40 border-chalkboard-70;
 }
 
+/* Thanks Chris I needed this https://css-tricks.com/slightly-careful-sub-elements-clickable-things/ */
+button > * {
+  @apply pointer-events-none;
+}
+
 a {
   @apply text-primary underline hover:hue-rotate-15;
 }