mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-05-15 11:59:39 +03:00
Code Activity

Merge branch 'v4-dev' of https://github.com/twbs/bootstrap into v4-dev

Browse Source
This commit is contained in:
Mark Otto
2016-05-11 23:23:11 -07:00
parent 15874b7afc fda41fd440
commit fc75a2c78f
3 changed files with 35 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/components/card.md
+14 -1
View File
@@ -508,7 +508,7 @@ Only applies to small devices and above.
## Columns
Cards can be organized into [Masonry](http://masonry.desandro.com)-like columns with just CSS by wrapping them in `.card-columns`. Cards are ordered from top to bottom and left to right when wrapped in `.card-columns`.
Cards can be organized into [Masonry](http://masonry.desandro.com)-like columns with just CSS by wrapping them in `.card-columns`. Cards are ordered from top to bottom and left to right when wrapped in `.card-columns`.
Only applies to small devices and above.
@@ -576,3 +576,16 @@ Only applies to small devices and above.
</div>
</div>
{% endexample %}
Card columns can also be extended and customized with some additional code. Shown below is an extension of the `.card-columns` class using the same CSS we use—CSS columns— to generate a set of responsive tiers for changing the number of columns.
{% highlight scss %}
.card-columns {
@include media-breakpoint-only(lg) {
column-count: 4;
}
@include media-breakpoint-only(xl) {
column-count: 5;
}
}
{% endhighlight %}