rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-18 10:52:19 +01:00
Code Issues Actions Packages Releases Activity

clarify docs a bit more and remove some words; closes #21683

Browse Source
This commit is contained in:
Mark Otto 2017-03-25 16:00:51 -07:00 committed by Mark Otto
parent 8108c0357a
commit 9596cb5087
1 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
docs/layout/grid.md
View File

@ -130,11 +130,11 @@ See how aspects of the Bootstrap grid system work across multiple devices with a
## Auto-layout columns ## Auto-layout columns
Utilize breakpoint-specific column classes for equal-width columns. Add any number of unit-less classes for each breakpoint you need and every column will be the same width. Utilize breakpoint-specific column classes for easy column sizing without an explicit numbered class like `.col-sm-6`.
### Equal-width ### Equal-width
For example, here are two grid layouts that apply to every device and viewport, from `xs` to `xl`. For example, here are two grid layouts that apply to every device and viewport, from `xs` to `xl`. Add any number of unit-less classes for each breakpoint you need and every column will be the same width.
<div class="bd-example-row"> <div class="bd-example-row">
{% example html %} {% example html %}
@ -164,7 +164,7 @@ For example, here are two grid layouts that apply to every device and viewport,
### Setting one column width ### Setting one column width
Auto-layout for flexbox grid columns also means you can set the width of one column and the others will automatically resize around it. You may use predefined grid classes (as shown below), grid mixins, or inline widths. Note that the other columns will resize no matter the width of the center column. Auto-layout for flexbox grid columns also means you can set the width of one column and have the sibling columns automatically resize around it. You may use predefined grid classes (as shown below), grid mixins, or inline widths. Note that the other columns will resize no matter the width of the center column.
<div class="bd-example-row"> <div class="bd-example-row">
{% example html %} {% example html %}
@ -197,7 +197,7 @@ Auto-layout for flexbox grid columns also means you can set the width of one col
### Variable width content ### Variable width content
Using the `col-{breakpoint}-auto` classes, columns can size itself based on the natural width of its content. This is super handy with single line content like inputs, numbers, etc. This, in conjunction with [horizontal alignment](#horizontal-alignment) classes, is very useful for centering layouts with uneven column sizes as viewport width changes. Use `col-{breakpoint}-auto` classes to size columns based on the natural width of their content. Use these classes in conjunction with [horizontal alignment](#horizontal-alignment) classes for centering layouts with uneven column sizes as viewport width changes.
<div class="bd-example-row"> <div class="bd-example-row">
{% example html %} {% example html %}