Index: gc_lang/fr/webext/content_scripts/modify_page.js
==================================================================
--- gc_lang/fr/webext/content_scripts/modify_page.js
+++ gc_lang/fr/webext/content_scripts/modify_page.js
@@ -41,11 +41,10 @@
         nWrapper += 1;
         xParentElement.insertBefore(xWrapper, xTextArea);
         xWrapper.appendChild(xTextArea); // move textarea in wrapper
         let xToolbar = createWrapperToolbar(xTextArea);
         xWrapper.appendChild(xToolbar);
-        //loadImage("GrammalecteTitle", "img/logo-16.png");
     }
     catch (e) {
         showError(e);
     }
 }
@@ -55,17 +54,13 @@
 function createWrapperToolbar (xTextArea) {
     try {
         let xToolbar = document.createElement("div");
         xToolbar.style = "display: flex; justify-content: flex-end; margin-top: 5px; padding: 5px 10px;";
         /*let xLogo = document.createElement("img");
-        xLogo.src = browser.extension.getURL("img/logo-16.png");
+        xLogo.src = browser.extension.getURL("img/logo-16.png"); // can’t work, due to content-script policy: https://bugzilla.mozilla.org/show_bug.cgi?id=1267027
         xTitle.appendChild(xLogo);*/
 
-        let xImagePlace = document.createElement("span");
-        xImagePlace.className = "GrammalecteTitle";
-        xToolbar.appendChild(xImagePlace);
-
         xToolbar.appendChild(document.createTextNode("Grammalecte"));
         let xConjButton = document.createElement("div");
         xConjButton.textContent = "Conjuguer";
         xConjButton.style = sButtonStyle;
         xConjButton.onclick = function() {
@@ -104,11 +99,11 @@
     console.log("Conjugueur");
     if (xConjPanel !== null) {
         xConjPanel.style.display = "block";
     } else {
         // create the panel
-        xConjPanel = createPanelFrame("conj_panel", "Conjugueur", 500, 900);
+        xConjPanel = createPanelFrame("conj_panel", "Conjugueur");
         document.body.appendChild(xConjPanel);
     }
 }
 
 function createTFPanel (xTextArea) {
@@ -115,11 +110,11 @@
     console.log("Formateur de texte");
     if (xTFPanel !== null) {
         xTFPanel.style.display = "block";
     } else {
         // create the panel
-        xTFPanel = createPanelFrame("tf_panel", "Formateur de texte", 800, 500);
+        xTFPanel = createPanelFrame("tf_panel", "Formateur de texte");
         document.body.appendChild(xTFPanel);
         document.getElementById("tf_panel_content").appendChild(createTextFormatter(xTextArea));
     }
 }
 
@@ -127,11 +122,11 @@
     console.log("Lexicographe");
     if (xLxgPanel !== null) {
         xLxgPanel.style.display = "block";
     } else {
         // create the panel
-        xLxgPanel = createPanelFrame("lxg_panel", "Lexicographe", 400, 800);
+        xLxgPanel = createPanelFrame("lxg_panel", "Lexicographe");
         document.body.appendChild(xLxgPanel);
     }
 }
 
 function createGCPanel (oErrors) {
@@ -138,11 +133,11 @@
     console.log("Correction grammaticale");
     if (xGCPanel !== null) {
         xGCPanel.style.display = "block";
     } else {
         // create the panel
-        xGCPanel = createPanelFrame("gc_panel", "Correcteur", 400, 800);
+        xGCPanel = createPanelFrame("gc_panel", "Correcteur");
         document.body.appendChild(xGCPanel);
         document.getElementById("gc_panel_content").appendChild(document.createTextNode(JSON.stringify(oErrors)));
     }
 }
 

Index: gc_lang/fr/webext/content_scripts/panel_creator.js
==================================================================
--- gc_lang/fr/webext/content_scripts/panel_creator.js
+++ gc_lang/fr/webext/content_scripts/panel_creator.js
@@ -2,44 +2,32 @@
 // Panel creator
 
 "use strict";
 
 
-function createPanelFrame (sId, sTitle, nWidth, nHeight) {
+function createPanelFrame (sId, sTitle) {
     try {
-        let xPanel = document.createElement("div");
-        xPanel.style = "position: fixed; left: 50%; top: 50%; z-index: 100; border-radius: 10px;"
-                     + "color: hsl(210, 10%, 4%); background-color: hsl(210, 20%, 90%); border: 10px solid hsla(210, 20%, 70%, .5);"
-                     + 'font-family: "Trebuchet MS", "Liberation Sans", sans-serif;'
-                     + getPanelSize(nWidth, nHeight);
-        let xBar = document.createElement("div");
-        xBar.style = "position: fixed; width: "+nWidth+"px ; background-color: hsl(210, 0%, 100%); border-bottom: 1px solid hsl(210, 10%, 50%); font-size: 20px;";
+        let xPanel = createNode("div", {id: sId, className: "grammalecte_panel"});
+        let xBar = createNode("div", {className: "grammalecte_title_bar"});
         xBar.appendChild(createCloseButton(xPanel));
-        let xTitle = createDiv(sId+"_title", "", "", "padding: 10px 20px;");
+        let xTitle = createNode("div", {className: "grammalecte_title"});
         xTitle.appendChild(createLogo());
-        xTitle.appendChild(createDiv(sId+"_label", "Grammalecte · " + sTitle, "", "display: inline-block; padding: 0 10px;"));
+        xTitle.appendChild(createNode("div", {className: "grammalecte_label", textContent: "Grammalecte · " + sTitle}));
         xBar.appendChild(xTitle);
         xPanel.appendChild(xBar);
-        xPanel.appendChild(createDiv(sId+"_empty_space", "", "", "height: 50px;")); // empty space to fill behind the title bar
-        xPanel.appendChild(createDiv(sId+"_content", "", "", "overflow: auto;"));
+        //xPanel.appendChild(createNode("div", {className: "grammalecte_empty_space_under_title_bar"}));
+        xPanel.appendChild(createNode("div", {id: sId+"_content", className: "grammalecte_panel_content"}));
         return xPanel;
     }
     catch (e) {
         showError(e);
     }
 }
 
-function getPanelSize (nWidth, nHeight) {
-    let s = "width: "+ nWidth.toString() + "px; height: " + nHeight.toString() + "px;";
-    s += "margin-top: -" + (nHeight/2).toString() + "px; margin-left: -" + (nWidth/2).toString() + "px;";
-    return s;
-}
-
 function createCloseButton (xParentNode) {
     let xButton = document.createElement("div");
-    xButton.style = "float: right; padding: 2px 10px; color: hsl(210, 0%, 100%); text-align: center;"
-                  + "font-size: 22px; font-weight: bold; background-color: hsl(0, 80%, 50%); border-radius: 0 0 0 3px; cursor: pointer;";
+    xButton.className = "grammalecte_close_button";
     xButton.textContent = "×";
     xButton.onclick = function () {
         xParentNode.style.display = "none";
     }
     return xButton;
@@ -47,17 +35,19 @@
 
 
 /*
     Common functions
 */
-function createDiv (sId, sContent, sClass="", sStyle="") {
-    let xDiv = document.createElement("div");
-    xDiv.id = sId;
-    xDiv.className = sClass;
-    xDiv.style = sStyle;
-    xDiv.textContent = sContent;
-    return xDiv;
+function createNode (sType, oAttr) {
+    try {
+        let xNode = document.createElement(sType);
+        Object.assign(xNode, oAttr);
+        return xNode;
+    }
+    catch (e) {
+        showError(e);
+    }
 }
 
 function createCheckbox (sId, bDefault, sClass="")  {
     let xInput = document.createElement("input");
     xInput.type = "checkbox";

Index: gc_lang/fr/webext/content_scripts/text_formatter.js
==================================================================
--- gc_lang/fr/webext/content_scripts/text_formatter.js
+++ gc_lang/fr/webext/content_scripts/text_formatter.js
@@ -5,11 +5,11 @@
 
 function createTextFormatter (xTextArea) {
     let xTFNode = document.createElement("div");
     try {
         // Options
-        let xOptions = createDiv("tf_options", "");
+        let xOptions = createNode("div", {id: "tf_options"});
         let xSSP = createFieldset("group_ssp", true, "Espaces surnuméraires");
         xSSP.appendChild(createOptionInputAndLabel("o_start_of_paragraph", true, "En début de paragraphe"));
         xSSP.appendChild(createOptionInputAndLabel("o_end_of_paragraph", true, "En fin de paragraphe"));
         xSSP.appendChild(createOptionInputAndLabel("o_between_words", true, "Entre les mots"));
         xSSP.appendChild(createOptionInputAndLabel("o_before_punctuation", true, "Avant les points (.), les virgules (,)"));
@@ -50,17 +50,16 @@
         xOptions.appendChild(xDelete);
         xOptions.appendChild(xTypo);
         xOptions.appendChild(xMisc);
         xOptions.appendChild(xStruct);
         // Actions
-        let xActions = createDiv("tf_actions", "");
-        let xPgBarBox = createDiv("tf_progressbarbox", "");
-        xPgBarBox.innerHTML = '<progress id="progressbar" style="width: 400px;"></progress> <span id="time_res"></span>';
-        xActions.appendChild(createDiv("tf_reset", "Par défaut", "button blue"));
-        xActions.appendChild(xPgBarBox);
-        xActions.appendChild(createDiv("tf_apply", "Appliquer", "button green"));
-        xActions.appendChild(createDiv("infomsg", "blabla"));
+        let xActions = createNode("div", {id: "tf_actions"});
+        xActions.appendChild(createNode("div", {id: "tf_reset", textContent: "Par défaut", className: "button blue"}));
+        xActions.appendChild(createNode("progress", {id: "progressbar", style: "width: 25px"}));
+        xActions.appendChild(createNode("span", {id: "time_res"}));
+        xActions.appendChild(createNode("div", {id: "tf_apply", textContent: "Appliquer", className: "button green"}));
+        xActions.appendChild(createNode("div", {id: "infomsg", textContent: "blabla"}));
         // create result
         xTFNode.appendChild(xOptions);
         xTFNode.appendChild(xActions);
     }
     catch (e) {
@@ -69,13 +68,11 @@
     }
     return xTFNode;
 }
 
 function createFieldset (sId, bDefault, sLabel) {
-    let xFieldset = document.createElement("fieldset");
-    xFieldset.id = sId;
-    xFieldset.className = "groupblock";
+    let xFieldset = createNode("fieldset", {id: sId, className: "groupblock"});
     let xLegend = document.createElement("legend");
     let xInput = createCheckbox("o_"+sId, bDefault, "option");
     let xLabel = createLabel(xInput.id, sLabel);
     // create result
     xLegend.appendChild(xInput);
@@ -83,15 +80,14 @@
     xFieldset.appendChild(xLegend);
     return xFieldset;
 }
 
 function createOptionInputAndLabel (sId, bDefault, sLabel) {
-    let xOption = document.createElement("div");
-    xOption.className = "blockopt underline";
+    let xOption = createNode("div", {className: "blockopt underline"});
     let xInput = createCheckbox(sId, bDefault, "option");
     let xLabel = createLabel(sId, sLabel, "opt_lbl largew");
-    let xResult = createDiv("res_"+sId, "", "result fright");
+    let xResult = createNode("div", {id: "res_"+sId, className: "result fright"});
     // create result
     xOption.appendChild(xResult);
     xOption.appendChild(xInput);
     xOption.appendChild(xLabel);
     return xOption;

Index: gc_lang/fr/webext/manifest.json
==================================================================
--- gc_lang/fr/webext/manifest.json
+++ gc_lang/fr/webext/manifest.json
@@ -34,11 +34,12 @@
       "background.js"
     ]
   },
   "content_scripts": [
     {
-      "matches": ["*://*/*"],
+      "matches": ["<all_urls>"],
+      "css": ["content_scripts/content_panels.css"],
       "js": [
         "content_scripts/panel_creator.js",
         "content_scripts/text_formatter.js",
         "content_scripts/modify_page.js"
       ]