mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-30 16:50:00 +02:00
Code Issues Releases Wiki Activity

Revert "Allow individual grid classes to override .row-cols (#33621)" (#34612)

Browse Source 
This reverts commit f2b47e1c8a.
This commit is contained in:
Mark Otto
2021-07-28 21:29:46 -06:00
committed by GitHub
parent 4bfd8a2cbc
commit 906a990eb7
2 changed files with 3 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -299,9 +299,9 @@ Don't want your columns to simply stack in some grid tiers? Use a combination of
### Row columns
Use the responsive `.row-cols-*` classes to quickly set the number of columns that best render your content and layout. Whereas normal `.col-*` classes apply to the individual columns (e.g., `.col-md-4`), the row columns classes are set on the parent `.row` as a default for contained columns. With `.row-cols-auto` you can give the columns their natural width.
Use the responsive `.row-cols-*` classes to quickly set the number of columns that best render your content and layout. Whereas normal `.col-*` classes apply to the individual columns (e.g., `.col-md-4`), the row columns classes are set on the parent `.row` as a shortcut. With `.row-cols-auto` you can give the columns their natural width.
Use these row columns classes to quickly create basic grid layouts or to control your card layouts and override when needed at the column level.
Use these row columns classes to quickly create basic grid layouts or to control your card layouts.
{{< example class="bd-example-row" >}}
<div class="container">
@@ -369,25 +369,6 @@ Use these row columns classes to quickly create basic grid layouts or to control
</div>
{{< /example >}}
{{< example class="bd-example-row" >}}
<div class="container">
<div class="row row-cols-2 row-cols-lg-3">
<div class="col">Column</div>
<div class="col">Column</div>
<div class="col">Column</div>
<div class="col">Column</div>
<div class="col">Column</div>
<div class="col">Column</div>
<div class="col-4 col-lg-2">Column</div>
<div class="col-4 col-lg-2">Column</div>
<div class="col-4 col-lg-2">Column</div>
<div class="col-4 col-lg-2">Column</div>
<div class="col-4 col-lg-2">Column</div>
<div class="col-4 col-lg-2">Column</div>
</div>
</div>
{{< /example >}}
You can also use the accompanying Sass mixin, `row-cols()`:
```scss