0

Add margin, padding or even space between 2 list items which uses bootstrap by default.

Tried Topics

  1. Space between bootstrap columns

Here is the image attached

enter image description here

DEMO

<div class="container text-left">
<div class="row">
<div class="col-xs-4 col-sm-12">
                  <!-- Nav tabs -->
                  <ul class="nav nav-justified" id="nav-tabs" role="tablist">
                      <li role="presentation" class="active">
                          <a href="#" aria-controls="" role="tab" data-toggle="tab">
                              <img class="img" src="https://images.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png">
                              <span class="quote"><i class="fa fa-quote-left"></i></span>
                          </a>
                      </li>
                      <li role="presentation" class="">
                          <a href="#" aria-controls="" role="tab" data-toggle="tab">
                              <img class="img" src="https://images.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png">
                              <span class="quote"><i class="fa fa-quote-left"></i></span>
                          </a>
                      </li>

                  </ul>
              </div>

</div>
</div>
Community
  • 1
  • 1
Surya R Praveen
  • 3,393
  • 1
  • 24
  • 25

1 Answers1

0

since you are using table-cell so applying border-spacing: 10px; or border-spacing: 10px 0; should work for you

.nav-justified {
      border-spacing: 10px 0;
      border-collapse: separate;
}

see your updated fiddle enter image description here

Rahul
  • 4,294
  • 1
  • 10
  • 12