CODEWITHSUNDEEP
htmlcsstwitter-bootstrapresponsive-design
rowefx
rowefx

Reputation: 265

Bootstrap responsive column collapse

The application needs to be responsive, and on one of the pages it has a three column layout using span4 x3.

Everything works fine, but I just have a question about the responsiveness of when you get to iPad sizing. The columns go from 3 straight to 1, wouldn't it make more sense for the columns to collapse from 3 then to 2 columns and finally in to a single column layout.

Have I missed something in the documentation or is this working as intended? I would like it to go to two columns when it starts collapsing if possible, however.

Any help would be greatly appreciated.

Upvotes: 3

Views: 2384

Answers (1)

wandarkaf
wandarkaf

Reputation: 1889

Bootstrap is working as intended. You can overwrite this behavior thought, creating a custom reponsive design for ipad for example. Something like this:

/* Portrait tablet to landscape and desktop */
    @media (min-width: 768px) and (max-width: 979px) { ... }

/* Landscape phone to portrait tablet */
    @media (max-width: 767px) { ... }

I don't recomend you overwrite the bootstrap .less directly, just create a side version and use @import on your .less files

hope this helps.

Upvotes: 4

Related Questions