1 person found this helpful
I am sure that the resize property of these rectangles is set to "Responsive width and height". In this case when you reduce the with of the browser width and height of rectangles reduces proportionally but their X and Y position stays the same that results in to the increased gap in the vertical space.
If you set resize property to "Responsive width" then vertical spacing will remain same.
sorry but your solution is not working for me. I set up an example as you suggested:
The boxes are perfect squares and the spacing on all sides is the same. If I set the boxes to "Responsive width" and size the browser window, the horizontal space between the boxes reduces proportionally. The vertical space remains the same. I would like to maintain the same vertical and horizontal spacing. This can't be that hard. I can program this by hand fairly easily.
Gary Vey, you are right and wrong: Without any "precautions", the spacing between your boxes shrinks/grows proportionally in horizontal direction; The vertical distance remains static.
There is a simple way to make the vertical spacings scale proportionally as well.
Look at this example site:
How can this be achieved? Just look at the .muse file, you can download directly from this sample site. If you can’t figure out – ask!
(I think, it is better, first trying to find the solutions by oneself. This may help to deepen one’s understanding of Muse. )
Thanks Günther for taking the time to answer! Nice hack :-) Reminds me of the good old days when we used transparent GIFs to hold table column spacing ;-) ;-) but it works and that's what counts!
I can’t consider this to be a "hack" at all. This is, how dynamic horizontal shifting works. One simply should know it, and design one’s pages accordingly.
I consider placing empty unfilled rectangles between the rows (as in your example file) a design hack. If I delete them, the layout doesn't work as wanted. As I said, we did this with GIFs for many years. And as I also said, who cares, it works! Thanks!
Hello Günter Heißenbüttel,
I did not get the trick.
Could you please tell me more about your issue?
What doesn’t work for you? It is quite a simple layout.
One little hint:
- Download the .muse file directly from the sample site and open it in Muse.
- Open the „Layers“ panel.
- Click onto the small triangle to the left of the layer. Now you can see all elements.
- By clicking onto the small square to the right of the single entries, you can activate/deactivate every element. Just do it!
- Now, I think, you can see the trick.
If you encounter problems, please ask and/or follow these steps to help us helping you: https://forums.adobe.com/docs/DOC-8652