Reposition metatable to be always below snippet

Change-Id: Ibf9b7f26f8fb35f4acaf1c526553a00f70642a20
diff --git a/dev/demo/match.html b/dev/demo/match.html
index 4812950..96b8781 100644
--- a/dev/demo/match.html
+++ b/dev/demo/match.html
@@ -41,7 +41,7 @@
 	      </li>
         <li data-match-id="p15845-15846"
             data-text-sigle="GOE/AGI/00000"
-            data-available-info="base/s=spans corenlp/c=spans corenlp/p=tokens corenlp/s=spans dereko/s=spans malt/d=rels opennlp/p=tokens opennlp/s=spans tt/l=tokens tt/p=tokens tt/s=spans" data-info="{&quot;UID&quot;:0,&quot;author&quot;:&quot;Goethe, Johann Wolfgang von&quot;,&quot;corpusID&quot;:null,&quot;corpusSigle&quot;:&quot;GOE&quot;,&quot;docID&quot;:null,&quot;docSigle&quot;:&quot;GOE\/AGI&quot;,&quot;layerInfos&quot;:&quot;base\/s=spans corenlp\/c=spans corenlp\/p=tokens corenlp\/s=spans dereko\/s=spans malt\/d=rels opennlp\/p=tokens opennlp\/s=spans tt\/l=tokens tt\/p=tokens tt\/s=spans&quot;,&quot;matchID&quot;:&quot;p15845-15846&quot;,&quot;pubDate&quot;:&quot;1982&quot;,&quot;pubPlace&quot;:&quot;München&quot;,&quot;subTitle&quot;:&quot;Auch ich in Arkadien!&quot;,&quot;textID&quot;:null,&quot;textSigle&quot;:&quot;GOE\/AGI\/00000&quot;,&quot;title&quot;:&quot;Italienische Reise&quot;}"
+            data-available-info="base/s=spans corenlp/c=spans corenlp/p=tokens corenlp/s=spans dereko/s=spans malt/d=rels opennlp/p=tokens opennlp/s=spans tt/l=tokens tt/p=tokens tt/s=spans" data-info="{&quot;UID&quot;:0,&quot;author&quot;:&quot;Goethe, Johann Wolfgang von&quot;,&quot;corpusID&quot;:null,&quot;corpusSigle&quot;:&quot;GOE&quot;,&quot;docID&quot;:null,&quot;docSigle&quot;:&quot;GOE\/AGI&quot;,&quot;layerInfos&quot;:&quot;base\/s=spans corenlp\/c=spans corenlp\/p=tokens corenlp\/s=spans dereko\/s=spans malt\/d=rels opennlp\/p=tokens opennlp\/s=spans tt\/l=tokens tt\/p=tokens tt\/s=spans&quot;,&quot;matchID&quot;:&quot;p15845-15846&quot;,&quot;pubDate&quot;:&quot;1982&quot;,&quot;pubPlace&quot;:&quot;München&quot;,&quot;subTitle&quot;:&quot;Auch ich in Arkadien!&quot;,&quot;textID&quot;:null,&quot;textSigle&quot;:&quot;GOE\/AGI\/00000&quot;,&quot;title&quot;:&quot;Italienische Reise&quot;,&quot;desc&quot;:&quot;Ein wundervolles, wenn auch etwas langweiliges Buch, dass einen Roadtrip des berühmten deutschen Autors beschreibt.&quot;}"
             id="GOE/AGI/00000#p15845-15846">
           <div class="match-main">
           <div class="match-wrap">
diff --git a/dev/js/src/match/info.js b/dev/js/src/match/info.js
index a6ccbec..d207867 100644
--- a/dev/js/src/match/info.js
+++ b/dev/js/src/match/info.js
@@ -282,6 +282,7 @@
     },
 
 
+    // Add meta information to match
     addMeta : function () {
       var matchmeta = document.createElement('div');
       // matchRefClass.create();
@@ -297,9 +298,14 @@
 
         // Add metainfo to matchview
         var metaElem = matchRefClass.create(this._match).element(metaInfo);
-        this.element().appendChild(metaElem);
+        var elem = this.element();
 
-        console.log(this.element());
+        elem.insertBefore(
+          metaElem,
+          elem.firstChild
+        );
+
+        console.log(elem);
       };
     },
 
diff --git a/dev/scss/header/menu.scss b/dev/scss/header/menu.scss
index e22a654..2696163 100644
--- a/dev/scss/header/menu.scss
+++ b/dev/scss/header/menu.scss
@@ -45,7 +45,7 @@
   padding-top: 0;
   padding-bottom: 0;
   span {
-    display: block;
+    display: block !important;
     line-height: 0;
     color: transparent;
   }
diff --git a/dev/scss/main/matchinfo.scss b/dev/scss/main/matchinfo.scss
index 0062131..f6ce9e0 100644
--- a/dev/scss/main/matchinfo.scss
+++ b/dev/scss/main/matchinfo.scss
@@ -381,8 +381,10 @@
       margin: 0;
       width: 100%;
       max-width: none;
+      max-height: 6em;
       margin-left: $border-size;
-      // padding-left: 2 * $border-size;
+      white-space: normal;
+      overflow: visible;
     }
   }
 }