Images resize in width and height, while text resizes in width only.
Solution: use resize "stretch to browser width" or resize in width only and image and text will always appear as you like.
Thank you for your reply. So there is no way to have the text position change in reation to the bottom of the image? Because i would prefer the image to resize in height also.
1 person found this helpful
This works – and works not (what is a general mathematical issue and not a Muse problem.)
When elements are overlapping, it is heavy for Muse to decide,
- which element should influence wich other element(s), and
- what is the reference point, the „source" of the „scaling behaviour (the „small" element itself, the bigger element in the background or the top of the page)
This problem increases, if the elements are of different height and/or of different scaling behaviour.
There are ways to help Muse to find the preferred decision:
- Place an equally scaling, transparent element of the same width exactly over the bigger element (in your case: the image), but make sure, that it won’t overlap the overlapping element.
- Group this „guiding“, transparent element with the overlapping element (in your case: the text frame)..
Now Muse has a better idea, what you are expecting to happen.
You can make the text frame behaving correctly, but since the text within doesn’t scale, the „amount of text overlapping“ visually changes. Look at this screencast (the „guiding frame“ – normally invisible – is coloured here orange for better visualisation):
In the linked .muse sample file, you will see, that the text frame scales absolutely correct and synchronously to the image container behind, but the visual appearance seems to be wrong, because the text doesn’t scale synchronously to the image behind.
As I said: This is not a Muse problem, but a physical/technical issue, which only can be solved by converting the text to an image (best choice: SVG). As an example, I placed an image next to the text frame.
Here you find the sample .muse file: https://www.dropbox.com/s/qr5xsqy6atd5tvr/text-partially-over-image.muse?dl=0
There are certain ways to „moderate" this behaviour, but not to avoid it:
You may use a „States“ button, place it overlapping and force it to scale proportionally by placing an empty image container together with the text frame into it. But this only will retard the described behaviour.
Perfect! Thank you this is exactly what i was missing!