Master sticky header + footer, and page elements all pinned center, yet not

[ktdid.]

I have a master page setup with:

-     a pinned to top and centered header

-     a centered footer

A page setup with:

-     various elements centered

All 3 different groups of elements should behave identically and remain center aligned with one another in the middle of the browser at all times, however they "center" on different Y-axis when previewed and the viewport is scaled down

WHY?

Also, when scaling the viewport down the page content stops as if there is a left margin. There is no left margin of any kind anywhere.

WHY?

Thanks for any help!

Katie

[Günter Heißenbüttel]

Please reduce your site to only one page and only a few „misbehaving“ elements and share this .muse file. Then we can have a look.

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

[ktdid.]

Hi there,

I'll prepare a file to share with you. In the meantime, below are some screenshots of the viewport at three sizes to show you what I mean.

And I need to correct myself:

"All 3 different groups of elements should behave identically and remain center aligned with one another in the middle of the browser at all times, however the pinned header "centers" on different Y-axis then the footer and page content when previewed and the viewport is scaled down"

Thank you!

[ktdid.]

Here is a dropbox link to a test Muse file to show the issue I'm having:

Dropbox - fb-foruminvestigatefile.muse

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

Centering elements vertically isn’t actually possible in Muse „out of the box“. To achieve that, youhave to use 3rd party widgets.

In horizontal direction, Muse does exactly, what you told it to do:

You have a fixed width page with breakpoints. Do the following:

Deselect all elements and choose the „Fill“ command in Muse’s upper control strip to colour your page background. Now you’ll see, what is your page and what represents the browser background. Additionally you will see that the horizontal centering stops, when you reach the breakpoint’s/page’s edges at 816 px. Some master page element stop centering at 960 px, because you don’t have a smaller breakpoint on your master.. This is absolutely normal behaviour for fixed width pages. To avoid this, create a smaller fixed width breakpoint at about 320 px.

Before going on, I’d suggest, that you have a very intense look at the Muse tutorials, which you find here: https://helpx.adobe.com/support/muse.html – especially at the „beginner’s guide.

[ktdid.]

The master page header does not stop, but continues to respond. This is the main issue…

[ktdid.]

As the footer and page content do align center with one another and stop at a point together, the master header elements continue on…

Your explanation does not explain this…

[Günter Heißenbüttel]

These element are set to „Stretch to browser width". All as expected!

As I said: Watch the tutorials I linked.

[ktdid.]

As are the footer elements, yet they behave differently. The difference is that the header is pinned and the footer is not…so clearly the pinning makes a difference?

I have watched many tutorials, and thus I'm here asking for additional help.

[Günter Heißenbüttel]

Don‘t understand, what you mean …

[ankushr40215001]

Hey,

I have tried to do some experimenting with your file, Please check if this is what you looking for to achieve?

Here is the file - Adobe Creative Cloud.

Regards,

Ankush

[ktdid.]

Hi there. The file I downloaded doesn't solve the problem…elements are all sorts of unaligned. But thank you for trying to help! I THINK I've solved the problem! However, with Muse, just as I fix one thing, another thing goes wonky!