I set my background image to contain
:
.el {
background: url(path/to/img.jpg) no-repeat center center;
background-size: contain;
}
But that scales the image up. I want the image to never be bigger than its native dimensions, and only scale down when it won't fit at its native resolution.
Here's a demo: http://jsfiddle.net/6W3yh/
I'm looking for a solution in CSS only.
No JavaScript please.
max-width:(your max img width)
to your.el