List,
Having an RWD problem.
I have a container and an image. Nothing else is in the container. I
need to swap said image with another for smaller devices.
I could do this with background images except how do I handle the
height of the container proportionally scaling with the image?
If I put the image in as content, I can use img{max-width:100%}; to
handle the scaling, but the swap for smaller devices is where I get
stuck. Show/hide with display:none;/display:block; is one way, but
that means users download 2 images when they only need one.
I feel like this may be a JS solution, but I'm not that savvy with JS
so don't know what Google solutions I've come across are good to use.
Any thoughts? Can it be done with CSS in a way I'm not thinking of?
TIA
--
Tom Livingston | Senior Front-End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/