Copy link to clipboard
Copied
Hi all,
Please look at this attached video. I haven't figured out how to make a picture responsive like this. Does anyone have a solution?
Thanks!
Muse does exactly, what you tell it to do!
As already explained in your other thread (https://forums.adobe.com/thread/2522301), you pinned the menu elements to the bottom of the browser window – and just that happens! The blank space isn’t caused by the image, but by the height of your browser window. Use the „Footer“ option instead to correct this. Here a modified .muse file: https://www.dropbox.com/s/kxmfla1tolm1jhm/Cornerstone%20Scaling%20Issue_Mod.muse?dl=0
Copy link to clipboard
Copied
Try this video.
Adobe Muse 2016 Tutorial | Responsive Images vs Fills - YouTube
Copy link to clipboard
Copied
The video was a helpful in showing a different way of creating an image in the site. Thank you. However, I am still having the same problem. When I shrink the browser's width, it creates this white space, when the image should still hit the bottom of the page and not condense its height like it's been doing. How do I fix this?
Copy link to clipboard
Copied
Are you using Responsive Place (foreground image) or Fill (background image)?
Your example video appears to be using a background image (fill) because there is noticeable clipping when the image is down scaled.
Copy link to clipboard
Copied
I have tried both and they both leave the white space at the bottom. The picture I put in my last response was using fill.
Copy link to clipboard
Copied
Do you have a sticky footer?
Can you post a URL to your problem page?
Copy link to clipboard
Copied
Don‘t use an image frame (=„rectangle frame tool“), but a simple rectangle (=„rectangle tool“), fill it with an image by using the „Fill“ command in Muse‘s upper control strip and set the rectangle to „Responsive Width“ (not „Responsive Width and Height“). Then all should work as expected.
I described the difference between “rectangle tool“ and „rectangle frame tool“ here: https://forums.adobe.com/thread/2211736
Copy link to clipboard
Copied
I do have a sticky footer. I have put it at responsive width only and I am still left with the white space like before. I am also only using the rectangle tool, not frame. I've seen some posts talk about Muse not allowing full height capacity - wondering if this is the problem?
Copy link to clipboard
Copied
I'm not a big fan of sticky footers that rely on hacks which Muse does because it's not capable of supporting flexbox. But that's another topic.
Try it without the sticky footer and see what happens.
Copy link to clipboard
Copied
Turning off sticky footer doesn't help
Copy link to clipboard
Copied
Then give us a link to a sample .muse file (Dropbox), which demonstrates your issue. I think, you are mixing up differnt issues. The blank space isn‘t necessarily related to you “image scaling problem“.
Copy link to clipboard
Copied
Here it is. Thank you!
Copy link to clipboard
Copied
Muse does exactly, what you tell it to do!
As already explained in your other thread (https://forums.adobe.com/thread/2522301), you pinned the menu elements to the bottom of the browser window – and just that happens! The blank space isn’t caused by the image, but by the height of your browser window. Use the „Footer“ option instead to correct this. Here a modified .muse file: https://www.dropbox.com/s/kxmfla1tolm1jhm/Cornerstone%20Scaling%20Issue_Mod.muse?dl=0