rory
rory

Reputation: 1438

Bootstrap - Use up vertical space without masonry

I think the image below explains what I'm trying to do. Essentially I want the left cols from Rows 2 and 3 to take up the empty space above them but the height of Row 1 is dynamic. I'd rather not use hide/visible as colB contains an image which I don't want to load twice.

I'm wondering is there a bootstrap native method that I don't know of? The only thing I can think of now is using a small jquery function to set a minus margin top for Row2 of ~ (Row1.ColB.Height - Row1.ColA.Height) masonry alternative

Thanks in advance

Rory

Upvotes: 1

Views: 86

Answers (1)

Carol Skelly
Carol Skelly

Reputation: 362630

If the 2nd column (row 1 B) is taller as shown in your image, you can add a class to have it float right on larger screens..

@media (min-width:768px) {
    .pull-sm-right {
        float:right;
    }
}

http://www.codeply.com/go/N3bJZRencG

Upvotes: 1

Related Questions