title: Ul and LI items before and after all aligned orizontally
body: <p>Our web designer wants a vertical UL / LI list like the following image.</p>
  
  <p><img src="https://i.stack.imgur.com/BxMau.png" alt="What we are attempting to obtain"></p>
  
  <p>But using this style I obtained</p>
  
  <p><img src="https://i.stack.imgur.com/WYHPc.png" alt="enter image description here"></p>
  
  <p>the stye was the following</p>
  
  <pre><code>    &lt;style type="text/css"&gt;
  ul {
      list-style: none;
  
  }
  ul li:after {
      content: "\25BC \0020";
  }
  
  ul li:before {
      content: "\25A0 \0020"; color:#C60;
  }
  &lt;/style&gt;
  </code></pre>
  
  <p>Im going to pass to a table but is there a way to obtain an aligned list also if the line owerflows ?</p>