diff --git a/config/sync/editor.editor.wysiwyg.yml b/config/sync/editor.editor.wysiwyg.yml
index 2a2f683..945e3de 100644
--- a/config/sync/editor.editor.wysiwyg.yml
+++ b/config/sync/editor.editor.wysiwyg.yml
@@ -66,7 +66,7 @@ settings:
     language:
       language_list: un
     stylescombo:
-      styles: "h4.title-niv4|title niv4\r\nh5.title-niv5|title niv5\r\nh6.title-niv6|title niv6\r\nh7.intertitre-niv7|Intertitre niv7\r\np.quote|Quote\r\np.psychologist-instruction|Psychologist Instruction\r\np.note | Note\r\np.note-title | Note Title\r\nh8.note-title | h8 Note Title\r\np.caution | Caution\r\nh9.caution-title | Caution Title\r\np.rowspan | Rowspan\r\np.liste-tiret | Liste tiret"
+      styles: "h4.title-niv4|Title niv4\r\nh5.title-niv5|Title niv5\r\nh6.title-niv6|Title niv6\r\nh7.intertitre-niv7|Intertitre niv7\r\np.quote|Quote\r\np.psychologist-instruction|Psychologist Instruction\r\np.note | Note\r\np.note-title | Note Title\r\nh8.note-title | h8 Note Title\r\np.caution | Caution\r\nh9.caution-title | Caution Title\r\np.rowspan | Rowspan\r\np.liste-tiret | Liste tiret\r\np.cell-display-none | Display None\r\np.text-labor | Labor"
     drupallink:
       linkit_enabled: true
       linkit_profile: default
diff --git a/config/sync/filter.format.wysiwyg.yml b/config/sync/filter.format.wysiwyg.yml
index ec3ff47..91c18ba 100644
--- a/config/sync/filter.format.wysiwyg.yml
+++ b/config/sync/filter.format.wysiwyg.yml
@@ -51,7 +51,7 @@ filters:
     status: false
     weight: -42
     settings:
-      allowed_html: '<em> <strong> <cite> <blockquote cite> <code> <ul type> <ol type start> <li> <dl> <dt> <dd> <u> <a href hreflang !href accesskey id rel target title data-entity-type data-entity-uuid data-entity-substitution> <pre> <table> <caption> <tbody> <thead> <tfoot> <th> <td> <tr> <sub> <sup> <span dir lang> <img src alt data-entity-type data-entity-uuid data-entity-substitution data-align data-caption> <fn> <h1 class="title-part title-part-niv1"> <h2 id class="title-part-niv2"> <h3 id class="title-part-niv3"> <h4 id class="inter-titre title-part-niv4 title-niv4"> <h5 id class="inter-titre title-niv5"> <h6 id class="title-part-niv6 title-niv6"> <h7 class="title-part-niv7 title-niv7 intertitre-niv7"> <h8 class="note-title "> <h9 class="caution-title "> <p class="quote epigraph quote epigraph encadre quote psychologist-instruction note caution quote psychologist-instruction note caution liste-tiret quote psychologist-instruction note note-title caution liste-tiret quote psychologist-instruction note note-title caution rowspan liste-tiret ">'
+      allowed_html: '<em> <strong> <cite> <blockquote cite> <code> <ul type> <ol type start> <li> <dl> <dt> <dd> <u> <a href hreflang !href accesskey id rel target title data-entity-type data-entity-uuid data-entity-substitution> <pre> <table> <caption> <tbody> <thead> <tfoot> <th> <td> <tr> <sub> <sup> <span dir lang> <img src alt data-entity-type data-entity-uuid data-entity-substitution data-align data-caption> <fn> <h1 class="title-part title-part-niv1"> <h2 id class="title-part-niv2"> <h3 id class="title-part-niv3"> <h4 id class="inter-titre title-part-niv4 title-niv4"> <h5 id class="inter-titre title-niv5"> <h6 id class="title-part-niv6 title-niv6"> <h7 class="title-part-niv7 title-niv7 intertitre-niv7"> <h8 class="note-title "> <h9 class="caution-title "> <p class="quote epigraph quote epigraph encadre quote psychologist-instruction note caution quote psychologist-instruction note caution liste-tiret quote psychologist-instruction note note-title caution liste-tiret quote psychologist-instruction note note-title caution rowspan liste-tiret quote psychologist-instruction note note-title caution rowspan liste-tiret cell-display-none text-labor ">'
       filter_html_help: true
       filter_html_nofollow: false
   filter_align:
diff --git a/web/themes/custom/rorschach/scripts/main.js b/web/themes/custom/rorschach/scripts/main.js
index 1a462f1..0725711 100644
--- a/web/themes/custom/rorschach/scripts/main.js
+++ b/web/themes/custom/rorschach/scripts/main.js
@@ -2,33 +2,142 @@ console.log('salut');
 
 // fusion cellules dans tableau
 
-function tableOne(){
-  var table1cell1 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
-  var table1cell2 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
-  var table1cell3 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
-  var table1cell4 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
+///
+// doit chercher un p dans td dans tbody dans table dans .paragraph--type--text qui a la class .rowspan et setAttribut a son parent td
 
-  table1cell1.setAttribute('rowspan', '4');
-  table1cell2.style.display ="none";
-  table1cell3.style.display ="none";
-  table1cell4.style.display ="none";
+// var cellRowspan = document.querySelector('p.rowspan').parentElement;
+// cellRowspan.setAttribute('rowspan', '4');
+
+// // ok va chercher tous les éléments p.cell-display-none (child)
+// const pDisplayNone = document.querySelectorAll('p.cell-display-none');
+// console.log(pDisplayNone);
+
+
+
+
+
+// // ok va chercher un element td (parent)
+// var tdDisplayNone = document.querySelector('p.cell-display-none').parentElement;   
+// console.log(tdDisplayNone);
+// /// et lui appliquer une class.
+// tdDisplayNone.classList.add('display-none');
+
+///// comment aller chercher TOUS les éléments td ?  //////
+let p = document.querySelectorAll('p.cell-display-none');
+
+
+
+let pDisplayNone = document.querySelector('p.cell-display-none');
+console.log(pDisplayNone);
+let tdparent = [];
+while(pDisplayNone.parentNode.closest('td')){
+    tdparent.push(pDisplayNone.parentNode.closest('td'));
+    pDisplayNone = pDisplayNone.parentNode.closest('td');
 }
+console.log(tdparent);
 
 
-// function tableTwo(){
-//   var table2cell1 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
-//   var table2cell2 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
-//   var table2cell3 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
-//   var table2cell4 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
-  
-//   table2cell1.setAttribute('rowspan', '4');
-//   table2cell2.style.display ="none";
-//   table2cell3.style.display ="none";
-//   table2cell4.style.display ="none";
+/// pour chaque élément de array pDisplayNone ( NodeList ), 
+// pDisplayNone.forEach((element) =>document.querySelectorAll('td'));
+
+/// aller chercher le parent td 
+/// et lui appliquer une class.
+
+// faut faire un array de td avant de faire un for each
+// let td = new Array(pDisplayNone);
+// console.log(td);
+
+
+
+
+
+
+
+
+
+
+
+
+// const parent = document.getElementById("parent");
+// let childNodes = parent.childNodes;
+// console.log(childNodes.length); // let's assume "2"
+// parent.appendChild(document.createElement("div"));
+// console.log(childNodes.length); // outputs "3"
+
+
+
+// function displayNone(){
+
+  // for (let i = 0; i < cellsDisplayNone.lenght; i++ ){
+  //   const cellDisplayNone = cellsDisplayNone.parentElement[i]
+  //   // let cellDisplayNone = this.parentElement.getElementsByClassName("cell-display-none");
+  //   // console.log(cellDisplayNone);
+
+
+  // }
+
   
+// };
+// cellDisplayNone.classList.add('display-none');
+// cellDisplayNone.style.display ="none";
+
+
+
+
+// for (let i = 0; i < cellDisplayNone.lenght; i++ ){
+
+//   cellDisplayNone.style.display ="none";
 // }
 
-tableOne();
+
+//////////////
+
+// var cellsRowspan = document.getElementsByClassName("rowspan");
+// var cellsDisplayNone = document.getElementsByClassName("cell-display-none");
+
+// function rowspan(){
+//   // for (let i = 0; i < cellsRowspan.length; i++){
+//   //   cellsRowspan[i].
+//   // }
+//   let cellRowspan = this.parentNode.querySelector(".rowspan");
+//   cellRowspan.setAttribute('rowspan', '4');
+// }
+
+
+
+
+
+
+
+
+
+// function tableOne(){
+//   var table1cell1 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
+//   var table1cell2 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
+//   var table1cell3 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
+//   var table1cell4 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
+
+//   table1cell1.setAttribute('rowspan', '4');
+//   table1cell2.style.display ="none";
+//   table1cell3.style.display ="none";
+//   table1cell4.style.display ="none";
+// }
+
+
+// // function tableTwo(){
+// //   var table2cell1 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
+// //   var table2cell2 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
+// //   var table2cell3 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
+// //   var table2cell4 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
+  
+// //   table2cell1.setAttribute('rowspan', '4');
+// //   table2cell2.style.display ="none";
+// //   table2cell3.style.display ="none";
+// //   table2cell4.style.display ="none";
+  
+// // }
+
+// tableOne();
 // tableTwo();
 
 // var table2cell1 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
@@ -42,6 +151,14 @@ tableOne();
 // table2cell4.style.display ="none";
 
 
+// const table = document.getElementByClass("paragraph--type--text");
+// console.log(hello);
+// for (const child of table.children) {
+//   console.log(child.tagName);
+// }
 
-
+// const paragraph = document.getElementsByClassName("paragraph--type--text");
+// for (const table of paragraph.children){
+//   table.addClass("rowspan");
+// }
 
diff --git a/web/themes/custom/rorschach/scss/components/_tablefields.scss b/web/themes/custom/rorschach/scss/components/_tablefields.scss
index f5d935c..1b5d7f6 100644
--- a/web/themes/custom/rorschach/scss/components/_tablefields.scss
+++ b/web/themes/custom/rorschach/scss/components/_tablefields.scss
@@ -20,11 +20,12 @@ table{
         border: 1px solid #333; 
         text-align: center; 
         padding: 1rem;
-
+        background-color: red;
     }
 }
 
 
+
 #paragraph-id--226{
     tbody {
         td{
diff --git a/web/themes/custom/rorschach/scss/pages/_bookpage.scss b/web/themes/custom/rorschach/scss/pages/_bookpage.scss
index bfd8628..a9387a5 100644
--- a/web/themes/custom/rorschach/scss/pages/_bookpage.scss
+++ b/web/themes/custom/rorschach/scss/pages/_bookpage.scss
@@ -3,4 +3,6 @@
 }
 
 
-  
\ No newline at end of file
+.display-none{
+    display: none;
+}
\ No newline at end of file
diff --git a/web/themes/custom/rorschach/scss/styles.scss b/web/themes/custom/rorschach/scss/styles.scss
index 2879d94..a559aff 100644
--- a/web/themes/custom/rorschach/scss/styles.scss
+++ b/web/themes/custom/rorschach/scss/styles.scss
@@ -3,7 +3,7 @@
 /*components*/
 @import "components/_quotes";
 @import "components/_tablefields";  
-@import "components/_notes.scss";  
+@import "components/_notes";  
 
 /*global*/