Highlighted

Anchor links causing diagonal scrolling.

New Here ,
Jan 02, 2018

Copy link to clipboard

Copied

Hi, I have added link anchors to my site and they seem to make the page scroll diagonally when clicked. I've seen other discussions on this but still can't seem to see what is wrong with my site as the anchors are aligned left. Can anyone help with this? Thanks.

Scroll.PNG

Scroll 2.PNG

Again: Your breakpoint/page width is 980 px, as shown in the breakpoint bar. If the browser window is smaller than this size, your page elements don‘t fit into the browser window any more, and horizontal shifting takes place. Therefore you should give more „room“ at both sides of your page.

Views

417

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

Anchor links causing diagonal scrolling.

New Here ,
Jan 02, 2018

Copy link to clipboard

Copied

Hi, I have added link anchors to my site and they seem to make the page scroll diagonally when clicked. I've seen other discussions on this but still can't seem to see what is wrong with my site as the anchors are aligned left. Can anyone help with this? Thanks.

Scroll.PNG

Scroll 2.PNG

Again: Your breakpoint/page width is 980 px, as shown in the breakpoint bar. If the browser window is smaller than this size, your page elements don‘t fit into the browser window any more, and horizontal shifting takes place. Therefore you should give more „room“ at both sides of your page.

Views

418

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
Jan 02, 2018 0
LEGEND ,
Jan 02, 2018

Copy link to clipboard

Copied

Try this:

  • Select one anchor, right click onto it and choose "Select Same (Anchor)“– now all anchors are selected,
  • Go to the upper control strip and choose „Align left“.
  • Without deselecting the anchors, drag them altogether to the left edge outside of your defined page area.
  • Now preview your page and check, if it is still shifting.
  • If no: Congrats!
  • If yes, please delete all unrelated elements and  pages from your file and share this reduced .muse file with us (–> Dropbox, CC Files, …). You may use these instructions to do so: https://forums.adobe.com/docs/DOC-8652

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...
Jan 02, 2018 1
New Here ,
Jan 02, 2018

Copy link to clipboard

Copied

Hi, Unfortunately this still isn't working for me, the link to the file is here - https://adobe.ly/2EAdlIX

Thanks.

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...
Jan 02, 2018 0
LEGEND ,
Jan 02, 2018

Copy link to clipboard

Copied

Don’t think, your issue has something to do with the anchors.

Your page has a fixed width of 980 px (or do you think, it is 1180 px? No, this 1180 breakpoint is nothing but the representation of the browser background. You can clearly see this, if you select no element, and use the „Fill“ command to colour the page background.

Since there is no room at all between your page elements and the defined page width, most elements run out of the page boundaries, as soon as you minimally reduce the width of your browser window. If you set your browser window’s width to exactly 980 px, all seems to work fine.

As a rule of thumb: On a fixed width layout, you need room on your page to the left and right of the page elements. When these page elements are touched (by reducing the width of your browser window), you normally place one more breakpoint at this width and so on.

One more thing, which disturbs the behaviour or your page: You are using system fonts in your menu. It is Arial, but not the correct one (as many peaple, you seem to have different Arial versions on your machine.

The fix: Select your complete menu on master page and choose the „Text“ tool.

Now the Font menu appears in Muse’s upper control strip.

There go to the section „Standard Fonts with Fallback“ and choose the Arial listed under within this section.

If you use system font on your site, these fonts have to be converted to an image during output, and the former text elements react just like images. Read more in my answer #4 in this thread: https://forums.adobe.com/thread/2357163

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...
Jan 02, 2018 0
New Here ,
Jan 02, 2018

Copy link to clipboard

Copied

I am very new to muse so I am unsure what you are meaning by the page width issue, how would I fix this?

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...
Jan 02, 2018 0
LEGEND ,
Jan 02, 2018

Copy link to clipboard

Copied

Again: Your breakpoint/page width is 980 px, as shown in the breakpoint bar. If the browser window is smaller than this size, your page elements don‘t fit into the browser window any more, and horizontal shifting takes place. Therefore you should give more „room“ at both sides of your page.

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...
Jan 02, 2018 0