Highlighted

Issues with Muse preview on Mobile

New Here ,
Sep 05, 2018

Copy link to clipboard

Copied

I'm working on a site on Muse CC and I'm having issues with its mobile layouts.

I've worked with Muse since CS6, and didn't have any issues with any format of layout. So whether this is unique to me or a CC issue, I'm not sure.

This is the Master of the mobile site:

Muse1.PNG

As you can see, I'm setting up the Menu/header for the site. But when I preview the site, it shows this:

Muse2.PNG

The page appears to narrow and elements on the right hand side are shunted further right and off the page. What's there also becomes larger on the page in the preview. I was working on a tablet layout also, and elements got bigger and unaligned. So there appears to be weird spacing/sizing issues that I can't fix.

I've tried lowering the page width to what it appears to be in the preview (min is 320, max is 380 in the screenshots, which is default), I've tried pinning elements in various ways, resizing both elements and page, but nothing seems to stop everything getting shunted off the page. Putting things closer to the centre of the page will push it to a vaguely appropriate area, but it's difficult to design that way - difficult too to design when what you see on the design screen isn't what's actually going to happen.

I should also be mentioned that the centred text in the button (it's an accordion) isn't actually centred, that's pushed off to the right too for some reason.

Any advice/help so I can fix this?

Adobe Community Professional
Correct answer by Nancy OShea | Adobe Community Professional

An average portrait  phone viewport is only 320px wide, not 380.

Views

353

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Issues with Muse preview on Mobile

New Here ,
Sep 05, 2018

Copy link to clipboard

Copied

I'm working on a site on Muse CC and I'm having issues with its mobile layouts.

I've worked with Muse since CS6, and didn't have any issues with any format of layout. So whether this is unique to me or a CC issue, I'm not sure.

This is the Master of the mobile site:

Muse1.PNG

As you can see, I'm setting up the Menu/header for the site. But when I preview the site, it shows this:

Muse2.PNG

The page appears to narrow and elements on the right hand side are shunted further right and off the page. What's there also becomes larger on the page in the preview. I was working on a tablet layout also, and elements got bigger and unaligned. So there appears to be weird spacing/sizing issues that I can't fix.

I've tried lowering the page width to what it appears to be in the preview (min is 320, max is 380 in the screenshots, which is default), I've tried pinning elements in various ways, resizing both elements and page, but nothing seems to stop everything getting shunted off the page. Putting things closer to the centre of the page will push it to a vaguely appropriate area, but it's difficult to design that way - difficult too to design when what you see on the design screen isn't what's actually going to happen.

I should also be mentioned that the centred text in the button (it's an accordion) isn't actually centred, that's pushed off to the right too for some reason.

Any advice/help so I can fix this?

Adobe Community Professional
Correct answer by Nancy OShea | Adobe Community Professional

An average portrait  phone viewport is only 320px wide, not 380.

Views

354

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Sep 05, 2018 0
LEGEND ,
Sep 05, 2018

Copy link to clipboard

Copied

Let us have a look at your .muse file. The master, you have shown us, and a blank layout page is enough.

Upload the file to Dropbox or a similar service and post the download link here. Then we will see.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 05, 2018 0
New Here ,
Sep 06, 2018

Copy link to clipboard

Copied

Thanks, here's the download link:

Dropbox - PersonalWebsite18_19.muse

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 06, 2018 0
Adobe Community Professional ,
Sep 06, 2018

Copy link to clipboard

Copied

An average portrait  phone viewport is only 320px wide, not 380.

Nancy O'Shea, ACP
Alt-Web.com

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 06, 2018 0