Eliminating 'dead space' from a responsive Muse site.

[redpoint]

When resizing between breakpoints in Muse, large gaps in my content appear as objects rescale. See attached pictures with annotations in red.

Thank you.

Mike.

Is there anyway to prevent this.

[Günter Heißenbüttel · Accepted solution]

Yes, it can be prevented. Reason is, that you have differently scaling elements, and Muse can’t know, which element should push which other element down.

That is, what you can do:

• Make sure, that your elements don’t overlap.

• Group the elements, which are expected to influence each other.

• Use transparent placeholder rectangle to force the correct behaviour.

If you don’t succed, do the following: Create a new site with only one page and  only the elements, shown in your screenshot above. Upload this .muse(!) file to Dropbox or a similar file sharing service and provide the download link here. Then we can have a closer look.

[redpoint]

Hi Günter,

Thank you for your response. I've taken care of 1 and 2 already, but in terms of using a "transparent placeholder rectangle" - do you mean place it under the differently scaling objects?

[Günter Heißenbüttel]

The most simple way to solve this issue: Create a small(!) .muse file showing your issue or reduce an existing site to only one typical page, containing a few elements, which demonstrate your issue. (This is helpful, because it saves download- and analysing-time).

Upload this .muse file to Dropbox or a similar file sharing service and provide the download link here. Then we can have a closer look.

Thus, time consuming „question and answer“ games or pure guessing can be considerably reduced.

[redpoint]

OK - here's the page: Dropbox - TEST-SITE.muse

Not sure what's considered a small .muse file, but this is 53 MB - not sure why, as I've optimized everything.

Thank you so much!

[Günter Heißenbüttel]

Can’t test the site, because the "Hover Reveal" widgets are reacting erratically, showing only question marks. I think, these widgets are not responsive and cause the problems: Move the scrubber slowly to the left and you’ll notice, that the portrait images are "bleeding" out of the breakpoint width.

Just delete these widgets and test again …

[redpoint]

OK - so I've deleted that widget and gone another route. Seems to be better now.

But! Here's a related question. When scaling objects or widgets (i.e. between breakpoints), I was getting a lot of 'dead space' at the bottom of the page. I reduced the minimum page height to some arbitrary small number (i.e. smaller than the actual required page height) and the 'dead space' has disappeared. This leads me to my question. Should the minimum page height be less than or equal to smallest page size within each breakpoint (i.e. page size just before moving to a smaller breakpoint)? Hopefully that makes sense.

[Günter Heißenbüttel]

If you have no objects in the "body" (between header and footer) of your master page, is is a good idea, to choose your page height as minimal as necessary. The page height reacts dynamically and grows, if you add objects on your layout page above the footer area. Doing it this way, you avoid an unnecessary blank area between content and footer.

[michela33989343]

Hi, I have sort of the same problem with my sites. When i preview (or publish the site) i get a white dead space in bottom between footer and page content. But as soon as i resize the browser a pixel up or down the white space dissapears. How do i solve it. www.holymolysthlm.se/falk.html check it out.

[Günter Heißenbüttel]

As already mentioned in  this thread:

"Create a new site with only one page and  only the misbehaving elements. (Please take this advice, to eliminate all unnecessary pages and elements very serious.) Upload this .muse(!) file to Dropbox or a similar file sharing service and provide the download link here. Then we can have a closer look."

Please follow these instructions: https://forums.adobe.com/docs/DOC-8652