CODEWITHSUNDEEP
twitter-bootstrap
Joseph Lariosa
Joseph Lariosa

Reputation: 365

Bootstrap row-fluid 7 tiles in 3 row without spaces

I'm having problems cancelling the spaces on my tiles. I need it to be 3 rows and 7 tiles without spaces. 

<section class="the-team">
    <div class="container text-center">
        <div class="row-fluid">
             <img src="images/profiles/1.jpg">
             <img src="images/profiles/2.jpg">
             <img src="images/profiles/3.jpg">
             <img src="images/profiles/4.jpg">
             <img src="images/profiles/5.jpg">
             <img src="images/profiles/6.jpg">
             <img src="images/profiles/7.jpg">
             <img src="images/profiles/8.jpg">
             <img src="images/profiles/9.jpg">
             <img src="images/profiles/10.jpg">
             <img src="images/profiles/11.jpg">
             <img src="images/profiles/12.jpg">
             <img src="images/profiles/13.jpg">
             <img src="images/profiles/14.jpg">
             <img src="images/profiles/15.jpg">
             <img src="images/profiles/16.jpg">
             <img src="images/profiles/17.jpg">
             <img src="images/profiles/18.jpg">
             <img src="images/profiles/19.jpg">
             <img src="images/profiles/20.jpg">
             <img src="images/profiles/21.jpg">
        </div>
    </div><!--//container-->
</section>

enter image description here

How do I cancel the spaces between the tiles?

Upvotes: 1

Views: 355

Answers (1)

Peter Wooster
Peter Wooster

Reputation: 6089

The space is caused by the whitespace between the images. In HTML any amount of whitespace between inline elements is treated as one space.

If you set a font-size of 0 on the div, the space will vanish. 

.the-team .row-fluid {
    font-size:0;
}

This can also be fixed in the HTML by removing the spaces and returns between the images.

Another method is to put a small negative margin on the left side of the image, about .25em on all but the first image. this last choice is not very robust as the margin needed varies with the font and will overcompensate if the space is missing.

Upvotes: 1

Related Questions