How to Reposition the Slide-In Campaign

Are you trying to move your Slide-in Campaign to the other side of the screen? You can easily reposition the Slide-in Campaign to the left side of the browser window using a single line of CSS.

In this article, you will learn how reposition the Slide-In.

Before You Start

  • This guide assumes that you’re already familiar with our CSS Guide.

Reposition Left

To display your Slide-in campaign on the left side of the screen, add the following CSS to your campaign using the Custom CSS tool:

html div#om-{{id}} {
	right: auto !important;
	margin-left: 20px !important;
}

Reposition Center

To display the Slide-in campaign in the center of the page, add the following CSS to your campaign using the Custom CSS tool:

html div#om-{{id}} {
	left: calc(350px / 2) !important;
	right: calc(350px / 2) !important;
	margin-left: auto !important;
	margin-right: auto !important;
}
350 pixels is the default setting for new Slide-in campaigns, if you’ve changed the campaign container width you will need to update the CSS to reflect your campaign’s specific width. This code works only when you use pixel values and not percentages for the campaign container width.
If you’re serious about jumpstarting your website business growth, then get started with OptinMonster today!

Get Started With OptinMonster Today!

BONUS: Done-For-You Campaign Setup ($297 value)
Our conversion experts will design 1 free campaign for you to get maximum results – absolutely FREE! Click here to get started →