mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-21 12:51:52 +02:00
Code Issues Releases Wiki Activity

Add equal column mixin (#32155)

Browse Source
This commit is contained in:
CFX
2021-04-06 14:45:28 -04:00
committed by GitHub
parent 317c2cd08e
commit 0c56749f13
2 changed files with 11 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
scss/mixins/_grid.scss
View File

@@ -26,9 +26,14 @@
margin-top: var(--#{$variable-prefix}gutter-y); margin-top: var(--#{$variable-prefix}gutter-y);
} }
@mixin make-col($size, $columns: $grid-columns) { @mixin make-col($size: false, $columns: $grid-columns) {
@if $size {
flex: 0 0 auto; flex: 0 0 auto;
width: percentage($size / $columns); width: percentage($size / $columns);
} @else {
flex: 1 1 0;
max-width: 100%;
}
} }
@mixin make-col-auto() { @mixin make-col-auto() {

3
site/content/docs/5.0/layout/grid.md
View File

@@ -434,6 +434,9 @@ Mixins are used in conjunction with the grid variables to generate semantic CSS
// Make the element grid-ready (applying everything but the width) // Make the element grid-ready (applying everything but the width)
@include make-col-ready(); @include make-col-ready();
// Without optional size values, the mixin will create equal columns (similar to using .col)
@include make-col();
@include make-col($size, $columns: $grid-columns); @include make-col($size, $columns: $grid-columns);
// Get fancy by offsetting, or changing the sort order // Get fancy by offsetting, or changing the sort order