title: Display text over svg
body: <p>How you can see i try to dispay an ul list over an svg.</p>
  
  <p><img src="https://i.stack.imgur.com/v5sqc.png" alt="enter image description here"></p>
  
  <p>I tried something with z-index but it wont work!</p>
  
  <p>My html:</p>
  
  <pre><code>    &lt;nav&gt;
   &lt;svg id="bigTriangleColor" style="z-index:-100;fill:rgb(0,0,255);" xmlns="http://www.w3.org/2000/svg" width="100%" height="100" viewBox="0 0 100 100" preserveAspectRatio="none"&gt;
      &lt;path d="M0 0 L50 100 L100 0 Z" /&gt;
  &lt;/svg&gt;
    &lt;ul&gt;
     &lt;li&gt;&lt;a href="" title="Übersicht"&gt;Übersicht&lt;/a&gt;&lt;/li&gt;
     &lt;li&gt;&lt;a href="" title="Leute"&gt;Leute&lt;/a&gt;&lt;/li&gt;
     &lt;li&gt;&lt;a href="" title="Links"&gt;Links&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
   &lt;/nav&gt;
  </code></pre>
  
  <p>The css:</p>
  
  <pre><code>nav {background-color: rgb(14, 131, 205);}
  
  
  nav{
      border-width:1px 0;
      list-style:none;
      margin:0;
      padding:0;
      text-align:center;
  }
  nav li{
      display:inline;
  }
  nav a{
      display:inline-block;
      padding:15px;
      font-size: 17px;
      font-family: 'Open Sans', sans-serif;
      text-decoration:none;
  </code></pre>
  
  <p>Thanks for your help!</p>