Why doesn’t my page content shrink when I open a slider?

If your page content does not shrink when you activate your sliders, go to Overlay Sliders > Options tab and manually add the outermost CSS class or ID in Page Wrapper ID under Frontend Customization.

In order to get this CSS style:

  1. Visit any page on your website.
  2. Right-click on your page and select View Page Source (or Show Page Source, depending on the browser).
  3. The outermost CSS class or ID will be located just after your body tag. The body tag looks something like: <body id=”top” class=”home page page-id-1109…”>.

In the source code screenshot below, page is the outermost ID, so you would enter #page. If it were a ‘class’ you would enter .class, using a period (.) instead of (#).

view-source-outermost-css-id-mtheater