Editing style of border around imgaes?

bmunger · July 2015

Is there a way to change the attributes of the border around images? I wanted to change to a 2px gray boarder and maybe add a drop shadow. is that possible.

http://bmunger.com/pipeorgan/bench/

Albert · July 2015

Hi,

you can change border with below css:

.image_frame, .wp-caption { border: 2px solid #000 !important; }

but you can't add any shadow.

Thanks!

bmunger · July 2015

I put it into the CSS field in the column widget that holds the galley and didn't see any change. Is the correct location to apply this CSS?

Here is the page: http://bmunger.com/pipeorgan/bench/

Albert · July 2015

What? Did you read what this field is for? This is for class names, not for css. Each custom CSS should be pasted under Theme options > Custom CSS & JS > Custom CSS section.

bmunger · July 2015

As you can tell, I am not a developer and that field explicitly says "Custom CSS Item Class Names", so to me that means "CSS". I will try the correct method and let you know how it goes.

BTW, I am also a novice to Wordpress and having difficulty figuring out things on the BeTheme. I will probably have many more questions to come before I get this site where I need it. The next challenge I am facing is the menu/header. Not working as I had anticipated.

bmunger · July 2015

That CSS worked, but it affected all the images across the site. Is there a way to control that at a granular level. For example on my home page I only want to control the image borders in the gallery area.

Home: http://bmunger.com/pipeorgan/ I obviously don't want a border around my logo.

But on the galley pages, I wanted all the images to have borders.http://bmunger.com/pipeorgan/bench/

Can I use short code in the place where I have the galleries?

Here?

Albert · July 2015

If you want border for gallery items, then please use below css instead:

.gallery-item .image_frame, .gallery-item .wp-caption { border: 2px solid #000 !important; }

steadymarvin · August 2015

I'm having a similar problem, but I want to get rid of the borders site-wide. I've tried pasting the suggested CSS code into the custom CSS pane but it's not working for me.

Albert · August 2015

@steadymarvin If above css does not work for you, it means you did it wrong. If you will send us url to page where you want to remove borders, we'll have a look on it.

steadymarvin · August 2015

Hi, Thanks for your response:

The borders show up across the site, particularly here: http://www.beechwoodmarketing.com/site/our-work/

and here: http://www.beechwoodmarketing.com/site/news/

also here: http://www.beechwoodmarketing.com/site/the-team/

Albert · August 2015

@steadymarvin As we see, above css works fine. It's:

.image_frame, .wp-caption { border: 0 !important; }

steadymarvin · August 2015

I'm not sure what I did wrong in the first place but your code works a treat. Thank you very much

Albert · August 2015

Just as we told you before

You're welcome!

Editing style of border around imgaes?

Comments