JavaEar 专注于收集分享传播有价值的技术资料

Bootstrap unwanted space between image buttons

Relatively new to Bootstrap and in need of some help. I have attached an img url to aid with my explanation.

I have unwanted space inbetween image buttons, I want it to be a quarter of the size it currently is.

    <div class="col-sm-3">
    <asp:ImageButton src="Content/MPGCalc.png" id="Mpg" runat="server" class ="img-responsive" />
        <br />
        <p>Miles Per Gallon and Journey Cost Calculator</p>

I have done the above for each of the 8 images. I feel that the problem may be to do with that col-sm-3 is meant to only add upto 12.

Any advice would be appreciated!


  1. Thanks to Andrew Peterson for the link, I ended up adding a new class .nopadding but then editing the margin to remove the space inbetween, as shown below. Thanks for the input

    .nopadding {
       padding: 0 !important;
       margin-bottom: -70px !important;