title: Bootstrap 3 Horizontal and Vertical Divider
body: <p>I am having trouble to put in horizontal and vertical lines on my website. Not sure what's wrong with this.</p>
  
  <p>I tried using borders but I am not sure if I am doing it right.</p>
  
  <p>I would like to achieve a criss-cross dividers just like the below image:</p>
  
  <p><img src="https://i.stack.imgur.com/gT8m7.jpg" alt="enter image description here"></p>
  
  <p>Here's what my code looks like:</p>
  
  <pre><code>&lt;div class="container-liquid" style="margin:0px; padding: 0px"&gt;
      &lt;div class="row"&gt;
          &lt;div class="col-xs-6 col-sm-6 col-md-3 text-center leftspan" id="one"&gt;&lt;h5&gt;Rich Media Ad Production&lt;/h5&gt;&lt;img src="images/richmedia.png"&gt;&lt;/div&gt;
          &lt;div class="col-xs-6 col-sm-6 col-md-3 text-center leftspan" id="two"&gt;&lt;h5&gt;Web Design &amp; Development&lt;/h5&gt; &lt;img src="images/web.png" &gt;&lt;/div&gt;               
          &lt;div class="col-xs-6 col-sm-6 col-md-3 text-center leftspan" id="three"&gt;&lt;h5&gt;Mobile Apps Development&lt;/h5&gt; &lt;img src="images/mobile.png"&gt;&lt;/div&gt;
          &lt;div class="col-xs-6 col-sm-6 col-md-3 text-center rightspan" id="four"&gt;&lt;h5&gt;Creative Design&lt;/h5&gt; &lt;img src="images/mobile.png"&gt; &lt;/div&gt;
          &lt;div class="col-xs-12"&gt;&lt;hr&gt;&lt;/div&gt;
          &lt;div class="col-xs-6 col-sm-6 col-md-3 text-center leftspan" id="five"&gt;&lt;h5&gt;Web Analytics&lt;/h5&gt; &lt;img src="images/analytics.png"&gt;&lt;/div&gt;
          &lt;div class="col-xs-6 col-sm-6 col-md-3 text-center leftspan" id="six"&gt;&lt;h5&gt;Search Engine Marketing&lt;/h5&gt; &lt;img src="images/searchengine.png"&gt;&lt;/div&gt;
          &lt;div class="col-xs-6 col-sm-6 col-md-3 text-center leftspan" id="seven"&gt;&lt;h5&gt;Mobile Apps Development&lt;/h5&gt; &lt;img src="images/socialmedia.png"&gt;&lt;/div&gt;
          &lt;div class="col-xs-6 col-sm-6 col-md-3 text-center rightspan" id="eight"&gt;&lt;h5&gt;Quality Assurance&lt;/h5&gt; &lt;img src="images/qa.png"&gt;&lt;/div&gt;
  
          &lt;hr&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>