top | item 6595339

Responsive images without JavaScript

12 points| magikMaker | 12 years ago |bjorn.wikkeling.com | reply

5 comments

order
[+] saltado|12 years ago|reply
If you're using Twitter Boostrap 3, there's a new CSS class to make images responsive called 'img-responsive'
[+] zachsnow|12 years ago|reply
One IE annoyance that might apply here (if you even care about IE, and have lots of images on one page) is that only 31 style sheets can be applied at once.

http://blogs.telerik.com/aspnetmvcteam/posts/10-05-03/intern... (includes test page)

[+] magikMaker|12 years ago|reply
I thought that, that maximum of 31 stylesheets is only for external stylesheets, the styles in this code are written inline, that should work just fine I think, but I can do some tests to make sure.
[+] brimanning|12 years ago|reply
Not that big of a deal, but it means when you right-click to open the image in a new tab or save, it gives you the lo-res image (the src of the opacity 0 img tag since background images don't have this browser ability). Not sure it matters too much.
[+] magikMaker|12 years ago|reply
Good point, didn't think of that. I am also not sure how important that is.