Quick Fix to Remove Image Border in Blogger

Every blogger using the Image in their blog to describe the scene step by step or to add more user engagement by placing the attractive image. Image does not looks fine and professional with image border. We need to add some CSS code inside the Blogger to get rid of that image border and make blog looks more professional. Let me walk you through step by step guide on how to add the css inside blogger.

Move to the Blogger Dashboard and you can add the css in two ways. 1) By placing the CSS in HTML code or 2) By Adding it to the Blogger Template designer. If you are doing it in the first way by Placing the css inside html then its important to backup the Template first. But let me walk you through the easy way by placing the css externally such that no Template Backup is required.

Just move to the Blogger dashboard > Template > Customize and Now Inside the Blogger Template Designer move to the Add css option as shown in the Image below.
Now place below CSS code as shown in the below.

 .post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
padding: 0 !important;
border: none !important;
background: none !important;
-moz-box-shadow: 0px 0px 0px transparent !important;
-webkit-box-shadow: 0px 0px 0px transparent !important;
box-shadow: 0px 0px 0px transparent !important;

Now Apply the code and Bingo! See the Images in your Blog post. Now you have the Images without Border in Blogger.

Thanks and Leave the comment below if you have any trouble !

Leave a Comment