title: Center a vertical list inside a div
body: <p>I am struggling with possibly easy to solve question. I have a unordered list and 3 items inside a responsive divs. </p>
  
  <p>I have managed to centre it horizontally but the vertical is where I am struggling with. </p>
  
  <pre><code>&lt;div class="left"&gt;  
      &lt;div class="boxtext"&gt;
          &lt;div class="insidetext"&gt; 
              &lt;ul&gt;
                  &lt;li&gt;WATER&lt;/li&gt;
                  &lt;li&gt;JUICE&lt;/li&gt;
                  &lt;li&gt;TEA&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  .left {
      @include aspect-ratio(16,9);
      width: 50%;
      height: 100vh;
      min-width: 300px;
      position: relative;
      background-size: cover;
      background-color:#333;
      position: relative;
  }
  
  @media (max-width:768px) {
      .left {
          width: 100%;
          height: 70vh;
      }
  }
  
  .boxtext {
      @include aspect-ratio(16,9);
      border: solid white 0.15em;
      height: 70vh;
      width: 70%;
      margin: auto;
      position: absolute;
      top: 0; 
      left: 0; 
      bottom: 0; 
      right: 0;
      text-align: center;
  }
  
  @media (max-width:768px) {
      .boxtext {
          width: 70%;
          height: 70%;
      }
  }
  .insidetext {
      @include aspect-ratio(16,9);
      background-color: aliceblue;
      height: 70%;
      width: 70%;
      margin: auto;
      position: absolute;
      top: 0; 
      left: 0; 
      bottom: 0; 
      right: 0;
      font-size: 9vh;
      text-align: center;
      min-height:100px;
  }
  
  .insidetext li {
      list-style-type:none;
  }
  
  .insidetext ul {
      display: table;
      margin: 0 auto;
  }
  
  .insidetext ul,li {
      list-style-type: none;
      list-style-position:inside;
      margin:0 auto;
      padding:0;
      vertical-align:middle;
  }
  </code></pre>
  
  <p>here is a test: <a href="http://jsfiddle.net/qq3LLop8/" rel="nofollow">http://jsfiddle.net/qq3LLop8/</a></p>