Twenty Eleven Theme: How to Remove Gray Image Border ?

submit an image to know what exactly is your problem

Do not edit the Twenty Eleven theme. It is the default WordPress 3.2 theme and having access to an unedited version of the theme is vital when dealing with a range of site issues.

For this reason, it is recommended that you consider creating a child theme for your customisations. Once your child theme is active, we should be able to help with the customisation.

Ok, I have a child theme.

There is a gray border around every image that uses the align tag. How do I remove it?

Thank you.

I just saw this post and wondered if you’d gotten an answer.

This will remove the border. Be sure to put it in your child’s style.css:
img[class*=”align”],
img[class*=”wp-image-“],
#content .gallery .gallery-icon img {
border: none;
}

You will see a gray border when you mouse-over the image. If you want to eliminate that too, change the values to colors that work for you in this :
a:focus img[class*=”align”],
a:hover img[class*=”align”],
a:active img[class*=”align”],
a:focus img[class*=”wp-image-“],
a:hover img[class*=”wp-image-“],
a:active img[class*=”wp-image-“],
#content .gallery .gallery-icon a:focus img,
#content .gallery .gallery-icon a:hover img,
#content .gallery .gallery-icon a:active img {/* Add some useful style to those fancy borders for linked images … */
background: #fff;
border-color: #fff;
}

I tried this but it didn’t work. Did I not put the code in the right place in the style sheet??
Should it replace this?
img[class*=”align”],
img[class*=”wp-image-“] {
height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */

You can remove the borders in the advanced section in visual editing mode.
Yes, it is manual, but I like being able to choose which ones keep the border (I actually like it around the block photos)…not around transparent bg images, though.

Use this code, the CSS styles are set to none

/* Image borders */
img[class*=”align”],
img[class*=”wp-image-“],
#content .gallery .gallery-icon img {/* Add fancy borders to all WordPress-added images but not things like badges and icons and the like */
border: 0px solid #ddd;
padding: 6px;
}
.wp-caption img {
border-color: #eee;
}
a:focus img[class*=”align”],
a:hover img[class*=”align”],
a:active img[class*=”align”],
a:focus img[class*=”wp-image-“],
a:hover img[class*=”wp-image-“],
a:active img[class*=”wp-image-“],
#content .gallery .gallery-icon a:focus img,
#content .gallery .gallery-icon a:hover img,
#content .gallery .gallery-icon a:active img {/* Add some useful style to those fancy borders for linked images … */
background: none;
border: none;
}
.wp-caption a:focus img,
.wp-caption a:active img,
.wp-caption a:hover img {/* … including captioned images! */
background: none;
border-color: none;
}

Dear all,

I added it in my child ccs, but nothing happend ?? The last paragraphs in style now are as follows:

}
#site-description {
color: #7a7a7a;
font-size: 14px;
margin: 0 270px 0.65625em 0;

img[class*=”align”],
img[class*=”wp-image-“],
#content .gallery .gallery-icon img {border: none;}

The grey borders around the images are still there. What am I doing wrong?

Thanks!

Maud