In https://www.talkgraphics.com/showthr...on-the-outside, I pointed out a way of making elements that were Sticky and off the design page not to stick to the right edge of the browser , regardless of the browser width.

In CSS - Sticky Offsets.xar, I have simplified it to two specific user stories - off to the almost left and off to the almost right.
The diagonal Red line has a link to an Anchor, foot, placed at the page bottom to allow simple testing.

The top and bottom options are met in Xara already by:
Top - setting the element to be Sticky and moving it down from the top of the design page (trivial).
Bottom - setting the element to be Sticky and moving it up from the bottom of the design page (uses Autofit to Page > Bottom).
The elements are on the design page.

L&R are different as they are off-page and the Xara off-page capability only sticks them to the browser edge.
To offset:
Left - give the element(s) a ClassName of 'upLeft' - Name > hrtmlclass="upLeft"
Right - give the element(s) a ClassName of 'upRight' - Name > hrtmlclass="upRight"
Include CSS in Website Head:
<style>
.xr_stickie:has( .upRight ) {
right: 20px !important;
}
.xr_stickie:has( .upLeft ) {
left: 20px !important;
}
</style>
If you want a different indent, alter the gap sizes shown in Red above.

Acorn