diff options
| author | Mark Otto <[email protected]> | 2016-09-07 20:40:12 -0700 |
|---|---|---|
| committer | GitHub <[email protected]> | 2016-09-07 20:40:12 -0700 |
| commit | 07752bab7b248d9c064b7b85dcaeccccecde8fc7 (patch) | |
| tree | fe8925f34227972ba09bf2dab65e4eef7c87709c /docs/components | |
| parent | 5413787e403711a78843976a37a77b1c9ad51cc1 (diff) | |
| download | bootstrap-07752bab7b248d9c064b7b85dcaeccccecde8fc7.tar.xz bootstrap-07752bab7b248d9c064b7b85dcaeccccecde8fc7.zip | |
v4: Card image fixes (#20667)
* Add .img-fluid to card images in columns to ensure proper resizing
* change that variable from regular value to variable
* use calc to figure out a tighter border for card images
Diffstat (limited to 'docs/components')
| -rw-r--r-- | docs/components/card.md | 6 |
1 files changed, 3 insertions, 3 deletions
diff --git a/docs/components/card.md b/docs/components/card.md index 992f4a138..1cf116d86 100644 --- a/docs/components/card.md +++ b/docs/components/card.md @@ -517,7 +517,7 @@ Only applies to small devices and above. {% example html %} <div class="card-columns"> <div class="card"> - <img class="card-img-top" data-src="holder.js/100px160/" alt="Card image cap"> + <img class="card-img-top img-fluid" data-src="holder.js/100px160/" alt="Card image cap"> <div class="card-block"> <h4 class="card-title">Card title that wraps to a new line</h4> <p class="card-text">This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> @@ -534,7 +534,7 @@ Only applies to small devices and above. </blockquote> </div> <div class="card"> - <img class="card-img-top" data-src="holder.js/100px160/" alt="Card image cap"> + <img class="card-img-top img-fluid" data-src="holder.js/100px160/" alt="Card image cap"> <div class="card-block"> <h4 class="card-title">Card title</h4> <p class="card-text">This card has supporting text below as a natural lead-in to additional content.</p> @@ -557,7 +557,7 @@ Only applies to small devices and above. <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p> </div> <div class="card"> - <img class="card-img" data-src="holder.js/100px260/" alt="Card image"> + <img class="card-img img-fluid" data-src="holder.js/100px260/" alt="Card image"> </div> <div class="card card-block text-xs-right"> <blockquote class="card-blockquote"> |