How do I make all of my animal images rounded or circular in the Pet Adoption Toolkit?

Hi Michelle,

I've added a large amount of CSS in each toolkit I create.  The toolkit allows you to add custom CSS before you get your iFrame code. The CSS I use for the images is (and explanation beneath the code):

.rgtk-4dvbCUmb .rgtkSearchPetPicFixed {

    display: block;

    margin: 60px auto 10px auto;

    height: 200px;

    width: 200px;

    border-radius: 50%;

    border: 3px solid #33A882;

}

.rgtk-4dvbCUmb .rgtkSearchPetPicFixed These are the two classes that the toolkit assigns the picture. The 4dvbCUmb is my own toolkit key. Yours will be different, so replace 4dvbCUmb  with your own (found on you Rescue Groups Toolkit page)

Another way to find your particular classes for the pics on your page is to (in Chrome) right click on the pic and choose "Inspect".  You will see something like this: Top right is the image I am inspecting, and under that is the code assigned to it. That's how I know for sure the name of my CSS classes. You may only need to change the key and copy this code into your toolkit, or you may need to Inspect. I'm not sure if the class name is different for different toolkit layouts.

If you want to give it a try, using my identical settings and only have to change the key, here's a screenshot of our toolkit layout settings

The snippet I gave you is only for the rounded image. If you need any more style info, let me know. Happy to share.

Cherie

Greater Derry Humane Society

Well–after I answered, I saw that most of it was already posted on another post. Woopsie!

Thank you so much Cherie. We really appreciate it and organization's will too!