From 6e9100155da57a1459b5f970e15f3b095351b52f Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 12 Sep 2017 19:45:49 -0700 Subject: [PATCH] rewrite containers and rows section --- docs/4.0/layout/grid.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/4.0/layout/grid.md b/docs/4.0/layout/grid.md index cffc2e3287..4389c36cea 100644 --- a/docs/4.0/layout/grid.md +++ b/docs/4.0/layout/grid.md @@ -34,8 +34,8 @@ The above example creates three equal-width columns on small, medium, large, and Breaking it down, here's how it works: -- Containers provide a means to center your site's contents. Use `.container` for fixed width or `.container-fluid` for full width. -- Rows are horizontal groups of columns that ensure your columns are lined up properly. We use the negative margin method on `.row` to ensure all your content is aligned properly down the left side. +- Containers provide a means to center and horizontally pad your site's contents. Use `.container` for specific pixel width or `.container-fluid` for `width: 100%`. +- Rows are wrappers for columns. Each column has horizontal `padding` (called a gutter) for controlling the space between them. This `padding` is then counteracted on the rows with negative margins; this way, all your content is aligned properly down the left side. - Content should be placed within columns, and only columns may be immediate children of rows. - Thanks to flexbox, grid columns without a set width will automatically layout with equal widths. For example, four instances of `.col-sm` will each automatically be 25% wide for small breakpoints. - Column classes indicate the number of columns you'd like to use out of the possible 12 per row. So, if you want three equal-width columns, you can use `.col-sm-4`. -- 2.47.2