Nav Button Position

In the Sequence Properties pane of Sequence Designer, you can select the position of the navigation buttons (Back/Next) on the rendered page.

The position options are:

Bottom Left (default)
Top Left
Bottom Right
Top Right
Top and Bottom Left
Top and Bottom Right
Float Bottom Left
Float Top Left
Float Bottom Right
Float Top Right

Float positions stay in the same position as the page is scrolled. Normal positions are part of the layout and scroll with the page.

The default CSS for the button(s) position is shown below. You can create a custom style with new values:

<style>
    .cmc-form-navigation-buttons {
        margin-top: 0;
    }

    .cmc-form-navigation-buttons > input {
        padding-top: 9px;
    }
</style>

Notes

When the top right position is used, error messages will hide the buttons until the message is closed. To change this behavior, you can add the following CSS style in a non-visible HTML component on the first page of the sequence where error messages can be shown (or globally, see 3 ways to style sequences in Custom Styles). The defaults are shown here.
```
<style>
  .toast-top-right{
    top: 12px;
    right: 12px;
  }
</style>
```
You can change where the error message pops up by changing the values. For example, to move it 50px down, change the top to 62px.
When float positions are used, validation error messages will appear above the floating navigation buttons.