CSS issue on sizes ~<660px wide (with Avada theme)

  • Resolved santosGpz

    (@santosgpz)


    7 years, 4 months ago

    Hello,

    The plugin has been working flawlessly but developed an issue on smaller screen sizes (see screenshot.)

    I believe this is a CSS issue and have narrowed it down to possibly the following:
    .age-gate {
    transform: translateY(-50%);
    }

    Disabling this class kind of fixes the vertical alignment, but then the horizontal alignment is off.

    I’m seeing this on Chrome desktop (latest) and mobile. There is a possibility this may be my own site’s fault. I run a CSS minified plugin that may interfere, however, I’ve disabled it and still run into this issue.

    *Edit: It seems that there is an incompatibility with the Avada theme which is causing this. After disabling the option: “Footer Special Effects / Sticky Footer”, age gate shows up correctly on mobile.

    Not sure if there’s a way to fix this. I’d imagine the issue lies within a footer not being loaded at the age gate.

    Any thoughts?

    Dev site: lowspark.wpengine.com

    Screenshot:
    https://lowspark.wpengine.com/wp-content/uploads/2017/07/age_error.jpg

    • This topic was modified 7 years, 4 months ago by santosGpz. Reason: added screenshot
Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Phil

    (@philsbury)

    Hi,

    Looks like there’s not enough height for the age gate, if you add the following to your theme CSS it should fix it:

    .age-gate-wrapper {
    height: 100vh;
    }

    I’ll get it into the plugins CSS for the next release.

    Thanks
    Phil

    Thread Starter santosGpz

    (@santosgpz)

    Awesome, thanks Phil!

    You should also implement a donation button. I’d love to throw some bucks your way for being so responsive and doing solid work.

    Plugin Author Phil

    (@philsbury)

    This is now part of the plugin, as is a donate button in a new about tab ??

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘CSS issue on sizes ~<660px wide (with Avada theme)’ is closed to new replies.