title: Css border covering issue
body: <p>I have this css in my page</p>
  
  <pre><code>li
  {
      border-right:8px solid #101212;
      border-bottom:8px solid #33B5E5;
  }
  </code></pre>
  
  <p>After that by default borders are displayed in this way.</p>
  
  <p><img src="https://i.stack.imgur.com/o83ug.png" alt="enter image description here"></p>
  
  <p>But in my case I want something like this (bottom line covered black one)</p>
  
  <p><img src="https://i.stack.imgur.com/J1c7R.png" alt="enter image description here"></p>
  
  <p>How can I achieve this without changing my html (because it's generating automatically).</p>
  
  <p><strong>Edit:</strong></p>
  
  <p>Also note, that my ul tag is multiline, so everything isn't in one line and I can't have a workaround with giving border-bottom to my ul tag.</p>
  
  <p>I have this in my css.</p>
  
  <pre><code>ul
  {
     width:270px;
  }
  
  li
  {
     float: left;
     width:90px;
  }
  </code></pre>
  
  <p>and in my html</p>
  
  <pre><code>&lt;ul&gt;
              &lt;li&gt;&lt;a href="listview/index.html"&gt;&lt;div class="menu_item_img"&gt;&amp;#xe0dc;&lt;/div&gt;Editing &lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="listview/detailbuttons.html"&gt;&lt;div class="menu_item_img"&gt;&amp;#xe0db;&lt;/div&gt;Editing &lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="listview/databinding.html"&gt;&lt;div class="menu_item_img"&gt;&amp;#xe0da;&lt;/div&gt;Editing&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="listview/pull-to-refresh.html"&gt;&lt;div class="menu_item_img"&gt;&amp;#xe0de;&lt;/div&gt;Editing&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="listview/endless-scrolling.html"&gt;&lt;div class="menu_item_img"&gt;&amp;#xe0df;&lt;/div&gt;Editing&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="listview/pull-with-endless.html"&gt;&lt;div class="menu_item_img"&gt;&amp;#xe0cc;&lt;/div&gt;Editing&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="listview/press-to-load-more.html"&gt;&lt;div class="menu_item_img"&gt;&amp;#xe0cd;&lt;/div&gt;Editing&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="listview/fixedheaders.html"&gt;&lt;div class="menu_item_img"&gt;&amp;#xe0ca;&lt;/div&gt;Editing&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="listview/templates.html"&gt;&lt;div class="menu_item_img"&gt;&amp;#xe0c9;&lt;/div&gt;Editing&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>