Something unusual is occurring in my bootstrap css code. I am noticing strange plus signs that seem out of place, and I cannot pinpoint a reason for their existence.
Here's an example (you might need to enlarge the view as they are quite small):
This represents the html (I have kept it mostly unaltered from how it appears in the view source to ensure nothing is mistakenly removed):
<div align="left" class="col-xs-5 col-sm-7 col-md-7 searchresultbg" style="border:0px solid red; margin-top:10px;">
<div class="hidden-xs" style="border:0px solid red;"><br />
<a href="http://rover.ebay.com/rover/1/711-53200-19255-0/1?ff3=2&toolid=10044&campid=5337720480&customid=999999999999999&lgeo=1&vectorid=229466&item=121697860181" target="_blank">Strange Dragon vol.3 Hana to Yume Comics / Manga Comic from Japan</a> <br />
</div>
<div class="hidden-sm hidden-md hidden-lg" style="border:0px solid red;"><br />
<a href="http://rover.ebay.com/rover/1/711-53200-19255-0/1?ff3=2&toolid=10044&campid=5337720480&customid=999999999999999&lgeo=1&vectorid=229466&item=121697860181" target="_blank">Strange Dragon vol.3 Hana to Yume Comi [...]</a> <br />
</div>
<div class="hidden-xs" style="border:0px solid red;"><br /></div>
<div style="border:0px solid blue;">
Fixed Price<br />
Listed: Jul 07 2015 at 11:07AM<br />
Time Left: 6d 22h 0m<br />
</div>
<!-- site logo -->
<div class="hidden-xs"><br /></div><img src="/app/javax.faces.resource/ebaylogo.png.xhtml?ln=images" class="img-responsive maxwidth70 bottom-buffer10" />
</div>
This issue is consistent across all browsers. Any thoughts on why this may be happening?
EDIT: I have applied a gray background image to the entire row. Here is the css:
.searchresultbg {
background-image:url('../resources/images/searchresultbg.jpg');
border-radius: 8px;
}
I have confirmed that the image is clean.