Search code examples
jquerycssimage-galleryweebly

changing image border in gallery in weebly


I can't figure our how to change the gallery image borders on weebly. Client using weebly for ease of backend editing once designed..so these are my parameters. Except for these sorts of issues... it's pretty simple to make most code edits...until now!

Here's CSS mod for border style on regular images on weebly...site uses wrapping borders so you have to modify "none"

.wsite-image.wsite-image-border-none img{ border: 3px solid #000 !important }

Here's what I know is "in" the gallery code */ class=galleryimage-- class=galleryimageinnerwrapper have tried every permutation...nothing is working!

http://preview.goodinkproductions.com/OO6M03

Go to "ION Milling Page" and gallery I am playing with is at the bottom of the page


Solution

  • Applying the border to the image won't work, because the image is inside a container with overflow: hidden; I've just played around and set a border to this container using

    .galleryImageHolder {
      border: 2px solid red;
    }
    

    But to avoid misunderstandings - do you want to apply the border to the images displayed on the page or to the images when displayed in the modal window? And further concern - the content is displayed in an iframe. I'm not sure if this is only for this preview (as the id is preview-iframe) or if the live site will also display the content of the ION Milling Page as iframe with content coming from a different site.