touchstonejs-ui/less/mixins/image.less

React.js UI components for the TouchstoneJS platform http://touchstonejs.io

// Responsive image
//
// Keep images from scaling beyond the width of their parents.
.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
}