Highlighted

difference: pin top or center

Engaged ,
Jan 13, 2018

Copy link to clipboard

Copied


I can't tell the difference in my browser. In a situation like Terms of Service, Privacy Policy, and other pages with streams of paragraphs -- which do I want for responsive design, the center pin or the top pin? I've been swapping the top center pin (shown here) for the middle-of-page centered (second) choice:

Screen Shot 2018-01-13 at 5.04.05 PM.png

The left icon (6 dots) allows you, to pin element to a position relative to the browser window.

For example: Using the middle dot in the upper row will cause an element to stay visible at this position, even if you scroll your page up/downwards. You will see this, if your page is longer than the browser window.

The right pinning icon causes elements to stay at a fixed horizontal position of the page (not the browser window), what includes, that element, which use this pinning, are scrolling up/downwards together with your page.

Here some links, explaining this a little bit deeper:

This nice sample site visualizes the pinning options: http://winter-jam.businesscatalyst.com/pinning.html (scoll the page and resize the browser window.)

Here a short video explaining the differences:

And here some explanations of the Muse Product Msnager Dani Beaumont:

Be aware, that in the latest version of Muse pinning was modified, what means among others, the „3-dot-pinning“ is very often applied automatically and you won0t have to click onto a dot.

Views

235

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

difference: pin top or center

Engaged ,
Jan 13, 2018

Copy link to clipboard

Copied


I can't tell the difference in my browser. In a situation like Terms of Service, Privacy Policy, and other pages with streams of paragraphs -- which do I want for responsive design, the center pin or the top pin? I've been swapping the top center pin (shown here) for the middle-of-page centered (second) choice:

Screen Shot 2018-01-13 at 5.04.05 PM.png

The left icon (6 dots) allows you, to pin element to a position relative to the browser window.

For example: Using the middle dot in the upper row will cause an element to stay visible at this position, even if you scroll your page up/downwards. You will see this, if your page is longer than the browser window.

The right pinning icon causes elements to stay at a fixed horizontal position of the page (not the browser window), what includes, that element, which use this pinning, are scrolling up/downwards together with your page.

Here some links, explaining this a little bit deeper:

This nice sample site visualizes the pinning options: http://winter-jam.businesscatalyst.com/pinning.html (scoll the page and resize the browser window.)

Here a short video explaining the differences:

And here some explanations of the Muse Product Msnager Dani Beaumont:

Be aware, that in the latest version of Muse pinning was modified, what means among others, the „3-dot-pinning“ is very often applied automatically and you won0t have to click onto a dot.

Views

236

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 13, 2018 0
Community Beginner ,
Jan 13, 2018

Copy link to clipboard

Copied

Hello Anita

I'm not sure if I got your question right. In fact if you want that your text scrolls with the page, you take the simple center (the one you call middle-of-page-center). If, instead, you want, that your text sticks to the page with a fixed position regardless of scrolling, you take the top anchor.

The three top anchors work like that:

  • top-left: your text sticks to the top and the left margin. If you resize your browser, your text keeps the top and the left margin, and will - eventually - overflow to the right.
  • top-center: your text sticks to the top and the center. If you resize your browser, your text will keep its top margin and its "centered" position based on the distance from the center of the page.
  • top-right: your text sticks to the top and the right margin. If you resize your browser, your text keeps the top and the right margin, and will - eventually - overflow to the left.

Hope that helps in your decision.

Regards,

Tony

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 13, 2018 1
LEGEND ,
Jan 13, 2018

Copy link to clipboard

Copied

The left icon (6 dots) allows you, to pin element to a position relative to the browser window.

For example: Using the middle dot in the upper row will cause an element to stay visible at this position, even if you scroll your page up/downwards. You will see this, if your page is longer than the browser window.

The right pinning icon causes elements to stay at a fixed horizontal position of the page (not the browser window), what includes, that element, which use this pinning, are scrolling up/downwards together with your page.

Here some links, explaining this a little bit deeper:

This nice sample site visualizes the pinning options: http://winter-jam.businesscatalyst.com/pinning.html (scoll the page and resize the browser window.)

Here a short video explaining the differences:

And here some explanations of the Muse Product Msnager Dani Beaumont:

Be aware, that in the latest version of Muse pinning was modified, what means among others, the „3-dot-pinning“ is very often applied automatically and you won0t have to click onto a dot.

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 13, 2018 0
Engaged ,
Jan 13, 2018

Copy link to clipboard

Copied

Thank you, these are both excellent in helping me understand. It's much appreciated.

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 13, 2018 0