Adobe Edge Animate: Is there a way to use CSS media queries to resize an image?

Question

I'm using Adobe Edge Animate and I'm really having trouble with all the different screen sizes and resolutions. I see that Adobe is coming out with new products which may address this issue. Basically all I'm tryng to do is have an image display (like a banner for example) that fills the width of the user's screen. I see the following questions, but answers are old and I know that there has been a lot of development in this area. Any ideas greatly apprciated.

Stackoverflow questions

Answer 1

From the splash screen. In the Properties tab change the switch next to the width to make it 100%. Select the Max W parameter and change this to too. All these tweaks will make the layout responsive. Next drag the image onto the stage and position in the top-left corner. In Properties click on Use Presets for Responsive Layout and choose the Center Background Image option, then Apply. This means the image will stay central whenever the stage morphs. Drag the bottom-right corner handle so the image fits over the entire background. Notice the image doesn’t scale or stretch but stays in the centre. In the Position and Size tab is an expand button; click this and add a Max W of (how many px your image is). Change the width to 100% and press Enter. It will jump right back to 75% but it has accepted the change. Click on the resize marker and drag to the left to see what happens when the stage is resized to a smaller layout. As you can see, the background is clipped but the image resizes to fit.

Here is a link to the tutorial I think this will better answer your question if you do this tutorial. http://www.webdesignermag.co.uk/tutorials/create-a-responsive-animation-with-adobe-edge-animate/