aboutsummaryrefslogtreecommitdiff
path: root/docs/components
diff options
context:
space:
mode:
authorMark Otto <[email protected]>2016-12-22 16:41:56 -0800
committerMark Otto <[email protected]>2016-12-22 16:41:56 -0800
commit503c4da10a0e2957d0fde4a9d3b22c1317145f26 (patch)
treee168377883d4d05b0428b535078516a11462f80e /docs/components
parent5d592d16dbc565ebdd3a7ddd3b2dd216c60a752a (diff)
downloadbootstrap-503c4da10a0e2957d0fde4a9d3b22c1317145f26.tar.xz
bootstrap-503c4da10a0e2957d0fde4a9d3b22c1317145f26.zip
redo docs intro for the example
Diffstat (limited to 'docs/components')
-rw-r--r--docs/components/card.md6
1 files changed, 4 insertions, 2 deletions
diff --git a/docs/components/card.md b/docs/components/card.md
index 8dfc8c861..85261469c 100644
--- a/docs/components/card.md
+++ b/docs/components/card.md
@@ -16,10 +16,12 @@ If you're familiar with Bootstrap 3, cards replace our old panels, wells, and th
## Example
-Cards require a small amount of markup and classes to provide you with as much control as possible. These classes and markup are flexible though and can typically be remixed and extended with ease. For example, if your card has no flush content like images, feel free to put the `.card-block` class on the `.card` element to consolidate your markup.
+Cards are built with as little markup and styles as possible, but still manage to deliver a ton of control and customization. Built with flexbox, they offer easy alignment and mix well with other Bootstrap components.
+
+Below is an example of a basic card with mixed content and a fixed width. Cards have no fixed width to start, so they'll naturally fill the full width of it's parent element. This is easily customized with our various [sizing options](#sizing).
{% example html %}
-<div class="card">
+<div class="card" style="width: 20rem;">
<img class="card-img-top" data-src="holder.js/100px180/" alt="Card image cap">
<div class="card-block">
<h4 class="card-title">Card title</h4>