Index: gc_lang/fr/webext/content_scripts/init.js
==================================================================
--- gc_lang/fr/webext/content_scripts/init.js
+++ gc_lang/fr/webext/content_scripts/init.js
@@ -63,10 +63,11 @@
     createTFPanel: function () {
         if (this.oTFPanel === null) {
             this.oTFPanel = new GrammalecteTextFormatter("grammalecte_tf_panel", "Formateur de texte", 800, 620, false);
             //this.oTFPanel.logInnerHTML();
             this.oTFPanel.insertIntoPage();
+            this.oTFPanel.adjustHeight();
         }
     },
 
     createLxgPanel: function () {
         if (this.oLxgPanel === null) {

Index: gc_lang/fr/webext/content_scripts/panel.js
==================================================================
--- gc_lang/fr/webext/content_scripts/panel.js
+++ gc_lang/fr/webext/content_scripts/panel.js
@@ -9,26 +9,26 @@
     constructor (sId, sTitle, nWidth, nHeight, bFlexible=true) {
         this.sId = sId;
         this.nWidth = nWidth;
         this.nHeight = nHeight;
         this.bFlexible = bFlexible;
+        this.xPanelBar = createNode("div", {className: "grammalecte_panel_bar"});
         this.xPanelContent = createNode("div", {className: "grammalecte_panel_content"});
         this.xWaitIcon = this._createWaitIcon();
-        this.xPanelNode = this._createPanel(sTitle);
+        this.xPanel = this._createPanel(sTitle);
         this.center();
     }
 
     _createPanel (sTitle) {
         try {
             let xPanel = createNode("div", {id: this.sId, className: "grammalecte_panel"});
-            let xBar = createNode("div", {className: "grammalecte_panel_bar"});
-            xBar.appendChild(this._createButtons());
+            this.xPanelBar.appendChild(this._createButtons());
             let xTitle = createNode("div", {className: "grammalecte_panel_title"});
             xTitle.appendChild(this._createLogo());
             xTitle.appendChild(createNode("div", {className: "grammalecte_panel_label", textContent: sTitle}));
-            xBar.appendChild(xTitle);
-            xPanel.appendChild(xBar);
+            this.xPanelBar.appendChild(xTitle);
+            xPanel.appendChild(this.xPanelBar);
             xPanel.appendChild(this.xPanelContent);
             return xPanel;
         }
         catch (e) {
             showError(e);
@@ -80,55 +80,60 @@
         xButton.onclick = function () { this.hide(); }.bind(this);  // better than writing “let that = this;” before the function?
         return xButton;
     }
 
     insertIntoPage () {
-        document.body.appendChild(this.xPanelNode);
+        document.body.appendChild(this.xPanel);
     }
 
     show () {
-        this.xPanelNode.style.display = "block";
+        this.xPanel.style.display = "block";
     }
 
     hide () {
-        this.xPanelNode.style.display = "none";
+        this.xPanel.style.display = "none";
     }
 
     center () {
         let nHeight = (this.bFlexible) ? window.innerHeight-100 : this.nHeight;
-        this.xPanelNode.style = `top: 50%; left: 50%; width: ${this.nWidth}px; height: ${nHeight}px; margin-top: -${nHeight/2}px; margin-left: -${this.nWidth/2}px;`;
+        this.xPanel.style = `top: 50%; left: 50%; width: ${this.nWidth}px; height: ${nHeight}px; margin-top: -${nHeight/2}px; margin-left: -${this.nWidth/2}px;`;
     }
 
     stickToLeft () {
         let nHeight = (this.bFlexible) ? window.innerHeight-100 : this.nHeight;
-        this.xPanelNode.style = `top: 50%; left: -2px; width: ${this.nWidth}px; height: ${nHeight}px; margin-top: -${nHeight/2}px;`;
+        this.xPanel.style = `top: 50%; left: -2px; width: ${this.nWidth}px; height: ${nHeight}px; margin-top: -${nHeight/2}px;`;
     }
 
     stickToRight () {
         let nHeight = (this.bFlexible) ? window.innerHeight-100 : this.nHeight;
-        this.xPanelNode.style = `top: 50%; right: -2px; width: ${this.nWidth}px; height: ${nHeight}px; margin-top: -${nHeight/2}px;`;
+        this.xPanel.style = `top: 50%; right: -2px; width: ${this.nWidth}px; height: ${nHeight}px; margin-top: -${nHeight/2}px;`;
     }
 
     stickToTop () {
         let nWidth = (this.bFlexible) ? Math.floor(window.innerWidth/2) : this.nWidth;
         let nHeight = (this.bFlexible) ? Math.floor(window.innerHeight*0.45) : this.nHeight;
-        this.xPanelNode.style = `top: -2px; left: 50%; width: ${nWidth}px; height: ${nHeight}px; margin-left: -${nWidth/2}px;`;
+        this.xPanel.style = `top: -2px; left: 50%; width: ${nWidth}px; height: ${nHeight}px; margin-left: -${nWidth/2}px;`;
     }
 
     stickToBottom () {
         let nWidth = (this.bFlexible) ? Math.floor(window.innerWidth/2) : this.nWidth;
         let nHeight = (this.bFlexible) ? Math.floor(window.innerHeight*0.45) : this.nHeight;
-        this.xPanelNode.style = `bottom: -2px; left: 50%; width: ${nWidth}px; height: ${nHeight}px; margin-left: -${nWidth/2}px;`;
+        this.xPanel.style = `bottom: -2px; left: 50%; width: ${nWidth}px; height: ${nHeight}px; margin-left: -${nWidth/2}px;`;
     }
 
     reduce () {
         // todo
     }
+
+    adjustHeight () {
+        this.xPanelContent.style.height = this.xPanelContent.firstChild.offsetHeight + "px"; // xPanelContent has only one child
+        this.xPanel.style.height = this.xPanelBar.offsetHeight + this.xPanelContent.offsetHeight + 10 + "px";
+    }
 
     logInnerHTML () {
         // for debugging
-        console.log(this.xPanelNode.innerHTML);
+        console.log(this.xPanel.innerHTML);
     }
     
     startWaitIcon () {
         this.xWaitIcon.style.visibility = "visible";
     }

Index: gc_lang/fr/webext/content_scripts/panel_gc.css
==================================================================
--- gc_lang/fr/webext/content_scripts/panel_gc.css
+++ gc_lang/fr/webext/content_scripts/panel_gc.css
@@ -177,11 +177,11 @@
     cursor: pointer;
     border-radius: 2px;
     text-decoration: none;
     text-shadow: unset;
     /* default color */
-    background-color: hsl(240, 10%, 50%);
+    background-color: hsl(240, 10%, 90%);
     color: hsl(240, 0%, 96%);
 }
 .grammalecte_error:hover {
     background-color: hsl(240, 10%, 40%);
     color: hsl(240, 0%, 100%);
@@ -200,17 +200,18 @@
 }
 
 
 /* elems */
 .grammalecte_error_WORD {
-    background-color: hsl(0, 50%, 50%);
-    color: hsl(0, 0%, 96%);
+    border-bottom: 2px solid hsl(0, 10%, 30%);
+    background-color: hsl(0, 50%, 96%);
+    color: hsl(0, 0%, 6%);
     /*text-decoration: underline wavy hsl(0, 50%, 50%);*/
 }
 .grammalecte_error_WORD:hover {
-    background-color: hsl(0, 60%, 40%);
-    color: hsl(0, 0%, 100%);
+    background-color: hsl(0, 60%, 90%);
+    color: hsl(0, 0%, 0%);
 }
 
 /* elems */
 .grammalecte_error_typo, 
 .grammalecte_error_esp,