diff options
| author | Mark Otto <[email protected]> | 2015-02-09 16:28:18 -0800 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2015-02-09 16:28:18 -0800 |
| commit | e0f2db23d724f7ff1eb00d5e35fc4a911447a912 (patch) | |
| tree | 6caa6c203d92b31a14480767bd40374e405da917 | |
| parent | 3efa9c46a40e49109e7a14d58ee7f8b170a3d17b (diff) | |
| parent | 894ec6f71419a0a7028e49a655623934f03ba24c (diff) | |
| download | bootstrap-e0f2db23d724f7ff1eb00d5e35fc4a911447a912.tar.xz bootstrap-e0f2db23d724f7ff1eb00d5e35fc4a911447a912.zip | |
Merge pull request #15772 from kkirsche/patch-15
Fixes #15653 — Add comment which explains that how a responsive im...
| -rw-r--r-- | docs/_includes/css/images.html | 5 |
1 files changed, 1 insertions, 4 deletions
diff --git a/docs/_includes/css/images.html b/docs/_includes/css/images.html index 9ce88698e..a79a4d920 100644 --- a/docs/_includes/css/images.html +++ b/docs/_includes/css/images.html @@ -3,10 +3,7 @@ <h2 id="images-responsive">Responsive images</h2> <p>Images in Bootstrap 3 can be made responsive-friendly via the addition of the <code>.img-responsive</code> class. This applies <code>max-width: 100%;</code>, <code>height: auto;</code> and <code>display: block;</code> to the image so that it scales nicely to the parent element.</p> - <div class="bs-callout bs-callout-warning" id="callout-images-text-align"> - <h4>Center aligning images</h4> - <p>Since <code>.img-responsive</code> changes the display type to <code>display: block;</code>, you can no longer align the image using text-align or any of the <a href="#type-alignment">alignment classes</a>. Instead, use <a href="#helper-classes-center"><code>.center-block</code></a> on the image element itself.</p> - </div> + <p>To center images which use the <code>.img-responsive</code> class, use <code>.center-block</code> instead of <code>.text-center</code>. <a href="../css/#helper-classes-center">See the helper classes section</a> for more details about <code>.center-block</code> usage.</p> <div class="bs-callout bs-callout-warning" id="callout-images-ie-svg"> <h4>SVG images and IE 8-10</h4> <p>In Internet Explorer 8-10, SVG images with <code>.img-responsive</code> are disproportionately sized. To fix this, add <code>width: 100% \9;</code> where necessary. Bootstrap doesn't apply this automatically as it causes complications to other image formats.</p> |
