Utilizing bootstrap, my aim is to display two spans side by side without any white margin between them. However, when I implement the code, there seems to be a white margin between each span.
This is the code in question:
<li class="span4" >
<div class="thumbnail">
<img src="img/placeholder-360x200.jpg" alt="product name">
<div class="container row-fluid">
<b>
<span class="span6 nospace" id="one"> <font size ="5px"><i>PHP 100,000</i></span>
<span class="span6 nospace pull-right" id="two" >50% Off </span>
</font>
</b>
</div>
<div class="caption">
<p>
Few attractive words about your product.Few attractive words about your product.
</p>
</div>
<div class="widget-footer">
<p>
<a href="#" class="btn btn-primary">Buy now</a>
<a href="product.html" class="btn">Read more</a>
</p>
</div>
</div>
</li>
In an attempt to solve this issue, I added the following CSS:
.nospace{
margin-left: 0;
}However, despite my efforts, the output still displays the white margin between the spans.
I am looking for a solution that will allow me to have the spans appear side by side with no white margin in between.