diff --git a/dev/demo/query-creator.html b/dev/demo/query-creator.html
index b904441..35a3b74 100644
--- a/dev/demo/query-creator.html
+++ b/dev/demo/query-creator.html
@@ -32,7 +32,7 @@
               <th>p</th>
               <td>ART</td>
               <td>ADJA</td>
-              <td>ADJA</td>
+              <td>ADJA<br>ADJD</td>
               <td>NN</td>
             </tr>
             <tr tabindex="0">
@@ -40,7 +40,7 @@
               <th>p</th>
               <td>ART</td>
               <td>ADJA</td>
-              <td>ADJA</td>
+              <td></td>
               <td>NN</td>
             </tr>
           </tbody>
diff --git a/dev/demo/query-creator.js b/dev/demo/query-creator.js
index 244f719..8c1784e 100644
--- a/dev/demo/query-creator.js
+++ b/dev/demo/query-creator.js
@@ -7,6 +7,6 @@
 
 define(['match/querycreator', 'lib/domReady'], function (qc, domReady) {
   domReady(function () {
-    qc.create(document.getElementsByClassName('matchtable')[0]);
+    qc.create(document.getElementsByClassName('matchinfo')[0]);
   });
 });
diff --git a/dev/js/src/match/info.js b/dev/js/src/match/info.js
index f8ac2cc..7a659ba 100644
--- a/dev/js/src/match/info.js
+++ b/dev/js/src/match/info.js
@@ -280,7 +280,7 @@
 	      matchtable.classList.remove('loading');
 
         // Add query creator
-        this._matchCreator = matchQueryCreator.create(matchtable);
+        this._matchCreator = matchQueryCreator.create(info);
       });
 
       // Get spans
diff --git a/dev/js/src/match/querycreator.js b/dev/js/src/match/querycreator.js
index ca5aaf9..d9c41de 100644
--- a/dev/js/src/match/querycreator.js
+++ b/dev/js/src/match/querycreator.js
@@ -21,8 +21,11 @@
       this._query = []
       this._matchInfo = matchInfo;
 
+      // Get the match table
+      this._matchTable = this._matchInfo.getElementsByClassName('matchtable')[0];
+
       // Listen on the match table
-      this._matchInfo.addEventListener(
+      this._matchTable.addEventListener(
         "click", this.clickOnAnno.bind(this), false
       );
 
@@ -187,7 +190,7 @@
       else {
 
         if (this._shown === false) {
-          this._matchInfo.appendChild(this._element);
+          this._matchInfo.insertBefore(this._element, this._matchTable.nextSibling);
           this._shown = true;
         };
 
diff --git a/dev/scss/main/matchinfo.scss b/dev/scss/main/matchinfo.scss
index ae73031..801503f 100644
--- a/dev/scss/main/matchinfo.scss
+++ b/dev/scss/main/matchinfo.scss
@@ -67,16 +67,6 @@
       }
     }
   }
-}
-
-div.matchtable {
-  z-index: 20;
-  margin-left: $left-distance - ($border-size / 2);
-  margin-right: $right-match-distance;
-  padding: 0;
-  overflow-x: auto;
-  overflow-y: visible;
-  width: auto;
 
   p.queryfragment {
     position:relative;
@@ -87,6 +77,13 @@
       radius: $standard-border-radius;
     }
     padding: 2pt 4pt !important;
+    margin: {
+      // left: $border-size;
+      left: $left-distance;
+      top: .5em;
+      bottom: .5em;
+      right: $right-match-distance;
+    }
     &:hover {
       cursor:pointer;
       @include choose-hover;
@@ -108,9 +105,19 @@
 	    content: $fa-to-query;
       position: absolute;
       right: 4pt;
-      top: 4pt;
+      top: $border-size;
     }
   }
+}
+
+div.matchtable {
+  z-index: 20;
+  margin-left: $left-distance - ($border-size / 2);
+  margin-right: $right-match-distance;
+  padding: 0;
+  overflow-x: auto;
+  overflow-y: visible;
+  width: auto;
 
   table {
     display: table;