Context

Spain

Image Right Crop

An image that stays it's original size and is cropped from the right as the width of it's parent container changes.

            
                        <style>
	/* Image Right Crop Pattern CSS */
    @media only screen and (max-width: 599px) {
        div[class="pattern"] {
			position: relative;
			overflow: hidden;
			width: 100%;
			height: 450px;
        }
        div[class="pattern"] img {
        	position: absolute;
        	top: 0;
        	left: 0;
        }
    }
</style>

<div class="pattern">
	<img src="spain.jpg" alt="Spain" width="600" height="450" style="display: block; border: 0;" />
</div>