Images are responsive by default

3 files changed, 6 insertions, 23 deletions

diff --git a/scss/_carousel.scss b/scss/_carousel.scss
index 90aee7ad9..7c045a1e9 100644
--- a/scss/_carousel.scss
+++ b/scss/_carousel.scss
@@ -21,7 +21,7 @@
     // Account for jankitude on images
     > img,
     > a > img {
-      @extend .img-responsive;
+      // @extend .img-responsive;
       line-height: 1;
     }
 
diff --git a/scss/_scaffolding.scss b/scss/_scaffolding.scss
index a6abc862d..27e09e96f 100644
--- a/scss/_scaffolding.scss
+++ b/scss/_scaffolding.scss
@@ -86,14 +86,13 @@ a {
 // Images
 
 img {
+  // Make them responsive with `max-width` and `height`
+  max-width: 100%;
+  height: auto;
+  // Match vertical alignment of most other Bootstrapped elements
   vertical-align: middle;
 }
 
-// Responsive images (ensure images don't scale beyond their parents)
-.img-responsive {
-  @include img-responsive();
-}
-
 // Rounded corners
 .img-rounded {
   @include border-radius($border-radius-lg);
@@ -110,7 +109,7 @@ img {
   @include box-shadow(0 1px 2px rgba(0,0,0,.075));
 
   // Keep them at most 100% wide
-  @include img-responsive(inline-block);
+  // @include img-responsive(inline-block);
 }
 
 // Perfect circle
diff --git a/scss/mixins/_image.scss b/scss/mixins/_image.scss
index bec9626f6..9ff91370d 100644
--- a/scss/mixins/_image.scss
+++ b/scss/mixins/_image.scss
@@ -1,19 +1,3 @@
-// Image Mixins
-// - Responsive image
-// - Retina image
-
-
-// Responsive image
-//
-// Keep images from scaling beyond the width of their parents.
-
-@mixin img-responsive($display: block) {
-  display: $display;
-  max-width: 100%; // Part 1: Set a maximum relative to the parent
-  height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
-}
-
-
 // Retina image
 //
 // Short retina mixin for setting background-image and -size.