Centre content with responsive export

Hi, I would like to know how i would centre exported content when it is exported for responsive.
It always exports left-aligned rather than centred.

Please see screenshots

Update - i have managed to centre it but it removes the background colour.

Starting around version 5 you need to have JavaScript enabled for centering of the main artboard to work because otherwise if the group was larger than the browser window it would clip the edges. With JS enabled it can prevent that. So it’s disabled on the artboard until your user enables JavaScript or you can define traditional CSS centering option and not require JS. There are some issues with it so it’s not the default option.

Select the main group or artboard and then in the style field use:

margin: 0 auto; position: relative;

I’m not sure why the background color would stop working but there was a bug along those lines a long time ago like version 3 so maybe there’s something there.

Can you select the artboard and click on the Show CSS button (in the Element Properties panel) and show what is in that? It should have a background color style:

https://velara-3.gitbook.io/web-export/element-options/show-css

Also, you can check the XD example projects to see and compare if the centering examples to compare to your own projects. There is an example on centering: