Bootstrap: Card-columns for two items

Created on 3 Feb 2017  路  5Comments  路  Source: twbs/bootstrap

When I have only two items in card-columns they are shown in one column - not in two next to each other.
v4-card-columns

css v4

All 5 comments

@piernik what are you trying to accomplish? card-columns seems to be only used in order to achieve a _masonry_ layout. If you need to to place these two side-by-side with equal heights, use card-group or card-deck. Otherwise, you should put your cards into grids.

I know, but data is fetched from database and I don't know if there will be 2 items or 20 items.

Get the count of items from database and set classes accordingly. This is outside the scope of bootstrap.

Yup, sorry, this isn't something we can handle. You'll probably need our grid system or additional code to do this right I imagine.

I actually want to understand the logic behind card-columns. I have a similar scenario working with 3 cards in a 3 column scenario. My logic expected to have one card on each column, or at least the most balanced/compacted arrangement of cards. Instead of that there is always at least card 1 and 2 in the same column even having a 3, 4, 5, etc... columns defined. I know the masonry lib can handle this with more flexibility, I just want to stick to use pure bootstrap.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

knownasilya picture knownasilya  路  3Comments

fohlsom picture fohlsom  路  3Comments

devdelimited picture devdelimited  路  3Comments

athimannil picture athimannil  路  3Comments

iklementiev picture iklementiev  路  3Comments