[Resolved] Picture Frame CSS Effect

Home Forums Support Picture Frame CSS Effect

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #897140
    Ashley

    Hi Guys,

    I’m putting together a site currently and I’ve created an inset border ‘picture frame’ style effect for the images to tie in with their branding.
    The CSS I’m using for this is currently:

    .entry-content img, .magic-mirror .elementor-row{
    outline: 4px solid #FCFAFA;
    outline-offset: -10px;
    }

    What I’m trying to apply this effect to is any image excluding logo, icons etc. as well as background images applied to Elementor sections or columns.

    I’ve managed to do this but you’ll notice on the homepage of this site there are some images (the course links about a 1/4 of the way down that this effect doesn’t apply to.

    I was using “.elementor-element-populated” as the selector for columns and rows but this applied the effect to any column within a row causing a ‘doubled up’ effect.

    Any ideas?

    #897147
    Leo
    Staff
    Customer Support

    Hi there,

    Have you checked with Elementor’s support since you are trying to modify their content?

    Let me know πŸ™‚

    #897315
    Ashley

    Tumbleweed is blowing in the land of Elementor support!

    Regardless, I had another coffee and worked out a workaround:

    .elementor-row > * .elementor-column-wrap{
    outline: none !important;
    }

    #897319
    Leo
    Staff
    Customer Support

    Glad you figured out πŸ™‚

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.