diff --git a/src/features/forms/components/inputs/FileInput.vue b/src/features/forms/components/inputs/FileInput.vue
index 8bf85a346e18dd22fed6accb4150bdee879b86a4..fc2b234e363cf75d710999fb47551deee5d1be93 100644
--- a/src/features/forms/components/inputs/FileInput.vue
+++ b/src/features/forms/components/inputs/FileInput.vue
@@ -4,6 +4,7 @@ import { graphService } from '@/src/shared/services';
 import { getCurrentState } from '@/src/shared/services/undoRedo.service';
 
 const props = defineProps<{
+    id: string;
     inputValue: string;
     label: string;
     accept: string;
@@ -68,7 +69,7 @@ let savedState = '';
 </script>
 
 <template>
-    <label class="input-label" :for="label">{{ label }}</label>
+    <label class="input-label" :for="id">{{ label }}</label>
     <div v-show="url" class="show-input">
         <div class="input-file">
             <input ref="fileInput" class="file" type="file" :accept="accept" @change="changeImage">
@@ -82,7 +83,7 @@ let savedState = '';
         </div>
     </div>
     <div v-if="!url">
-        <button :id="label" class="btn btn-form" @click="openFile">
+        <button :id="id" class="btn btn-form" @click="openFile">
             <i class="icon-plus"></i>
             {{ placeholder }}
         </button>
diff --git a/src/features/forms/components/inputs/GenericInput.vue b/src/features/forms/components/inputs/GenericInput.vue
index 2d7f0d26bcb5ca4b88334ead93790c372f302aa2..eddc770e655937c29eccd0a688392ce14f8267ff 100644
--- a/src/features/forms/components/inputs/GenericInput.vue
+++ b/src/features/forms/components/inputs/GenericInput.vue
@@ -14,8 +14,9 @@ import BadgesInput from './badges/BadgesInput.vue';
 import IconPicker from './badges/components/IconPicker.vue';
 import ConditionInput from './badges/components/ConditionInput.vue';
 import { Input, RepeatInputEvent } from '@/src/shared/interfaces';
+import { computed } from 'vue';
 
-defineProps<{
+const props = defineProps<{
     input: Input;
     inputValue: string | boolean | string[];
     icon?: string;
@@ -31,11 +32,16 @@ const emit = defineEmits<{
     (e: 'saveGivenState', state: string): void;
 }>();
 
+const inputId = computed(() => {
+    return props.pos !== null && props.pos !== undefined ? `${props.input.id}-${props.pos}` : props.input.id;
+});
+
 </script>
 
 <template>
     <TextInput
         v-if="input.type === 'text'"
+        :id="inputId"
         :label="input.label"
         :placeholder="input.placeholder"
         :input-value="inputValue as string"
@@ -45,6 +51,7 @@ const emit = defineEmits<{
     />
     <HtmlInput
         v-if="input.type === 'html'"
+        :id="inputId"
         :label="input.label"
         :placeholder="input.placeholder"
         :input-value="inputValue as string"
@@ -54,6 +61,7 @@ const emit = defineEmits<{
     />
     <TextAreaInput 
         v-if="input.type === 'textarea'"
+        :id="inputId"
         :label="input.label"
         :placeholder="input.placeholder"
         :input-value="inputValue as string"
@@ -61,8 +69,9 @@ const emit = defineEmits<{
         @input="emit('input', $event)"
         @save-given-state="emit('saveGivenState', $event)"
     />
-    <FileInput 
+    <FileInput
         v-if="input.type === 'file'"
+        :id="inputId"
         :label="input.label"
         :accept="input.accept"
         :input-value="inputValue as string"
@@ -72,6 +81,7 @@ const emit = defineEmits<{
     />
     <ScoreInput
         v-if="input.type === 'score'"
+        :id="inputId"
         :label="input.label"
         :input-value="inputValue as string"
         @input="emit('input', $event)"
@@ -79,6 +89,7 @@ const emit = defineEmits<{
     />
     <CheckBoxInput
         v-if="input.type === 'checkbox'"
+        :id="inputId"
         :label="input.label"
         :input-value="inputValue as boolean"
         :pos="pos"
@@ -87,6 +98,7 @@ const emit = defineEmits<{
     />
     <RadioInput
         v-if="input.type === 'radio-group'"
+        :id="inputId"
         :label="input.label"
         :input-value="inputValue as string"
         :pos="pos"
@@ -95,6 +107,7 @@ const emit = defineEmits<{
     />
     <SelectInput 
         v-if="input.type === 'select'"
+        :id="inputId"
         :label="input.label"
         :placeholder="input.placeholder"
         :input-value="inputValue as string"
@@ -105,6 +118,7 @@ const emit = defineEmits<{
     />
     <RepeatInput
         v-if="input.type === 'repeat'"
+        :id="inputId"
         :label="input.label"
         :placeholder="input.placeholder"
         :input-values="inputValue as string[]"
diff --git a/src/features/forms/components/inputs/HtmlInput.vue b/src/features/forms/components/inputs/HtmlInput.vue
index 938ae2e32665d84931296ff26334d3c452801571..11e1aaea61d8b484336ee5f5f43c1c703c641975 100644
--- a/src/features/forms/components/inputs/HtmlInput.vue
+++ b/src/features/forms/components/inputs/HtmlInput.vue
@@ -6,6 +6,7 @@ import {graphService} from '@/src/shared/services';
 import { getCurrentState } from '@/src/shared/services/undoRedo.service';
 
 const props = defineProps<{
+    id: string;
     label: string;
     inputValue: string;
     placeholder?: string;
@@ -90,11 +91,17 @@ function onBlur() {
     if(startValue !== content.value) emit('saveGivenState', savedState);
 }
 
+//? Didn't find a way to link the label to the editor because it uses a contenteditable p
+function focusEditor() {
+    const editor = getTinymce().activeEditor;
+    editor.focus();
+}
+
 </script>
 
 <template>
-    <label for="editor">{{ label }}</label>
-    <Editor 
+    <label @click="focusEditor">{{ label }}</label>
+    <Editor
         ref="editor"
         v-model="content"
         api-key="no-api-key"
diff --git a/src/features/forms/components/inputs/RepeatInput.vue b/src/features/forms/components/inputs/RepeatInput.vue
index 06d8c82e95dc29010e36b5c68ff33edb5b548497..27d4a6d8cd0e9a135d5b7fa66b9c91d1d3af061b 100644
--- a/src/features/forms/components/inputs/RepeatInput.vue
+++ b/src/features/forms/components/inputs/RepeatInput.vue
@@ -15,6 +15,7 @@ import { ref } from 'vue';
 import { generateContentId } from '@/src/shared/services/graph.service';
 
 const props = defineProps<{
+    id: string;
     inputs: Input[];
     label: string;
     inputValues: string[];
@@ -152,7 +153,7 @@ function dragOver(event: DragEvent) {
         <!--suppress VueUnrecognizedSlot -->
         <template #item="{ element, index }">
             <div :key="index" class="card draggable-card">
-                <div 
+                <div
                     class="card-header" 
                     :class="{ 'border-bottom': inputs.length >= 1, 'clickable': element.action }" 
                     @click="onClick(index, element.action)"
@@ -172,7 +173,7 @@ function dragOver(event: DragEvent) {
                     </div>
                 </div>
                 <div v-if="!element.action" class="card-content">
-                    <GenericInput 
+                    <GenericInput
                         v-for="(input, indexKey) in inputs"
                         :key="indexKey"
                         :input="input"
diff --git a/src/features/forms/components/inputs/ScoreInput.vue b/src/features/forms/components/inputs/ScoreInput.vue
index 19a3244982fecb6152d078bf67f12cb1b68075b6..ad4bf2337bf62bf6aaa5102a6354aebe5bc88c27 100644
--- a/src/features/forms/components/inputs/ScoreInput.vue
+++ b/src/features/forms/components/inputs/ScoreInput.vue
@@ -3,6 +3,7 @@ import { getCurrentState } from '@/src/shared/services/undoRedo.service';
 
 
 const props = defineProps<{
+    id: string;
     inputValue: string;
     label: string;
 }>();
@@ -47,10 +48,11 @@ function onBlur() {
 </script>
 
 <template>
-    <label for="input-score">{{ label }}</label>
-    <div id="input-score" class="input-score">
+    <label :for="id">{{ label }}</label>
+    <div class="input-score">
         <button @click="minus(inputValue)"><i class="icon-minus-circle"></i></button>
         <input
+            :id="id"
             type="number"
             :value="inputValue"
             @input="emit('input', ($event.target as HTMLInputElement).value)"
diff --git a/src/features/forms/components/inputs/TextAreaInput.vue b/src/features/forms/components/inputs/TextAreaInput.vue
index 9a8f536e83b535d48d69715599ea75ca48ea3968..225ae1d0930bb89834c23ab4c85b763e44b560ba 100644
--- a/src/features/forms/components/inputs/TextAreaInput.vue
+++ b/src/features/forms/components/inputs/TextAreaInput.vue
@@ -3,6 +3,7 @@ import { getCurrentState } from '@/src/shared/services/undoRedo.service';
 
 
 const props = defineProps<{
+    id: string
     label: string;
     placeholder: string;
     inputValue: string;
@@ -34,9 +35,9 @@ function onBlur() {
 </script>
 
 <template>
-    <label class="input-label" :for="label">{{ label }}</label>
+    <label class="input-label" :for="id">{{ label }}</label>
     <textarea
-        :id="label"
+        :id="id"
         class="input input-textarea"
         :class="{ 'input-card' : insideCard }"
         :placeholder="placeholder"
diff --git a/src/features/forms/components/inputs/TextInput.vue b/src/features/forms/components/inputs/TextInput.vue
index c9b67541ae3fabf938ff49b6992ceae8ec363ccf..5d650b0fdc6ceece402751451e5ae268d4f9f23d 100644
--- a/src/features/forms/components/inputs/TextInput.vue
+++ b/src/features/forms/components/inputs/TextInput.vue
@@ -2,6 +2,7 @@
 import { getCurrentState } from '@/src/shared/services/undoRedo.service';
 
 const props = defineProps<{
+    id: string;
     label: string;
     placeholder?: string;
     inputValue: string;
@@ -34,9 +35,9 @@ function onBlur() {
 </script>
 
 <template>
-    <label v-if="label !== ''" class="input-label" :for="label">{{ label }}</label>
+    <label v-if="label !== ''" class="input-label" :for="id">{{ label }}</label>
     <input
-        :id="label"
+        :id="id"
         class="input"
         :class="{ 'input-card' : insideCard }"
         type="text"
diff --git a/src/features/forms/components/inputs/card/components/CheckBoxInput.vue b/src/features/forms/components/inputs/card/components/CheckBoxInput.vue
index 8be574cab5f3f0784d436a58ba8b8fbb146aa53d..86200a670ba5dec5ae21a061fc531dcf87ad9f52 100644
--- a/src/features/forms/components/inputs/card/components/CheckBoxInput.vue
+++ b/src/features/forms/components/inputs/card/components/CheckBoxInput.vue
@@ -2,6 +2,7 @@
 import { getCurrentState } from '@/src/shared/services/undoRedo.service';
 
 defineProps<{
+    id: string;
     inputValue: boolean;
     label: string;
     pos: number;
@@ -27,13 +28,13 @@ function onChange(event: Event) {
 <template>
     <div class="checkbox">
         <input
-            :id="'Checkbox' + String(pos)"
+            :id="id"
             class="checkbox-input"
             type="checkbox"
             :checked="inputValue"
             @change="onChange"
         >
-        <label :for="'Checkbox' + String(pos)">{{ label }}</label>
+        <label :for="id">{{ label }}</label>
     </div>
 </template>
 
diff --git a/src/features/forms/components/inputs/card/components/RadioInput.vue b/src/features/forms/components/inputs/card/components/RadioInput.vue
index 289f2e67f8bcb377b973da49a6011987408f23ee..06a9f2e79454a51898ff91af6d61a3eea9bfcfee 100644
--- a/src/features/forms/components/inputs/card/components/RadioInput.vue
+++ b/src/features/forms/components/inputs/card/components/RadioInput.vue
@@ -1,11 +1,11 @@
 <script setup lang="ts">
 import { getCurrentState } from '@/src/shared/services/undoRedo.service';
 
-
 defineProps<{
-   inputValue: string;
-   label: string;
-   pos: number
+    id: string;
+    inputValue: string;
+    label: string;
+    pos: number
 }>();
 
 const emit = defineEmits<{
@@ -28,25 +28,25 @@ function onChange(value: string) {
         <div :id="String(pos)" class="radio-group">
             <div class="radio-btn">
                 <input
-                    :id="'left-' + String(pos)"
+                    :id="'left-' + id"
                     :name="'pos' + pos"
                     type="radio"
                     class="radio-input"
                     :checked="inputValue === '1'"
                     @change="onChange('1')"
                 >
-                <label :for="'left-' + String(pos)">Choix gauche</label>
+                <label :for="'left-' + id">Choix gauche</label>
             </div>
             <div class="radio-btn">
                 <input
-                    :id="'right-' + String(pos)"
+                    :id="'right-' + id"
                     :checked="inputValue === '2'"
                     :name="'pos' + pos"
                     class="radio-input"
                     type="radio"
                     @change="onChange('2')"
                 >
-                <label :for="'right-' + String(pos)">Choix droite</label>
+                <label :for="'right-' + id">Choix droite</label>
             </div>
         </div>
     </div>
diff --git a/src/features/forms/components/inputs/card/components/SelectInput.vue b/src/features/forms/components/inputs/card/components/SelectInput.vue
index 6e8fbeab91743c860d4fb9cd08559ebd5f2ac620..ece4a05fee7c05d954854afa174b708e5fd099f3 100644
--- a/src/features/forms/components/inputs/card/components/SelectInput.vue
+++ b/src/features/forms/components/inputs/card/components/SelectInput.vue
@@ -5,6 +5,7 @@ import { useEditorStore } from '@/src/shared/stores';
 const editorStore = useEditorStore();
 
 const props = defineProps<{
+    id: string;
     label: string;
     inputValue: string;
     placeholder: string;
@@ -36,9 +37,9 @@ function onChange(event: Event) {
 
 <template>
     <div class="select">
-        <label for="select-box">{{ label }}</label>
+        <label :for="id">{{ label }}</label>
         <select
-            id="select-box"
+            :id="id"
             :value="inputValue"
             class="select-box"
             @change="onChange"