Styling conflict with Responsive Lightbox plugin

  • Author
    Posts
  • #43740

    This just stated happening with the latest version of Tempera.

    Looks like there is a minor styling conflict between Tempera 1.5.1 and the Responsive Lightbox plugin ( https://wordpress.org/plugins/responsive-lightbox/ ).

    You can see an example of the issue here:
    http://whitewateroutlaw.net/gallery/

    Note that the “X” to close the modal window, and the caption bar at the bottom of the modal window, are not lining up as they should.

    Looks like this CSS:

    *, *::before, *::after {
        box-sizing: inherit;
    }

    In …wp-content/themes/tempera/style.css?ver=1.5.1 line 54 may be the issue.

    When I disable that style, the modal window looks as it should.

    Website: whitewateroutlaw.net/gallery

    #43799
    Zed
    Cryout Creations mastermind

    That’s part of the theme’s CSS resets to make appearance consistent between browsers (otherwise they’d all render things slightly differently due to different defaults).

    Try adding this custom CSS to remove the box-sizing on fancybox elements:
    #fancybox-wrap, #fancybox-outer { box-sizing: unset; }


    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
    #43819

    Thanks for your reply 🙂

    Hmmm…. Honesty, this just started happening with Tempera 1.5.x. The Responsive Lightbox plugin was last updated 2 months ago. Up until Tempera 1.5.x release, everything was rendering fine with both of these website components used in conjunction. I don’t know the finer details of how this CSS works, but maybe the Tempera elements need a more specific selector/name? It seems unwieldy for me to need to add this CSS correction to all the websites where I have a similar setup, especially since it was working fine previously

    Can you take a second look at this and maybe provide a fix on the Tempera theme?

    Thanks,
    Wayne

    • This reply was modified 7 years ago by WayneM.
    #43878

    Still hopeful for a theme code fix for this styling conflict. As noted, this was not an issue prior to ver 1.5x

    Thanks again for your awesome theme 🙂

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Styling conflict with Responsive Lightbox plugin’ is closed to new replies.