BLOGGER – Add black frame around photo AND remove margin under photo

[hendrix940]

I really appreciate the help. How can I add a thin black border around IMG tag and also, how can I remove the margin that’s under a photo?

Here’s HTML:

<a style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;" imageanchor="1" href="http://simeonhendrix.com/images/boogeyman-poster-movie.jpg"><img width="320" height="218" border="0" src="http://simeonhendrix.com/images/boogeyman-poster-movie.jpg"></a>Check out this Pen!

Here’s CSS:

element.style {

clear: right;

float: right;

margin-bottom: 1em;

margin-left: 1em;

}Check out this Pen!

THANK YOU SO MUCH!!!

[hendrix940]

I realize that all I need to do is remove the ‘MARGIN-BOTTOM’ from the CSS and that will remove the margin, HOWEVER, when I go into the HTML/CSS for my blogger, ‘ELEMENT.STYLE’ is not able to be found.

[hendrix940]

I found the answer here:
http://www.southernspeakers.net/2011/02/adding-shadow-around-blogger-post.html

[hendrix940]

Awesome! Thank you @chrisp I very much appreciate your explanation sir!!

[hendrix940]

@chrisp , so if I wanted to remove a margin-bottom attribute

element.style {

clear: right;

float: right;

margin-bottom: 1em;

margin-left: 1em;

}Check out this Pen!

[hendrix940]

on only the IMG tags … then, I would write it like this:

img {

border: 1px solid black;

margin-bottom: 0em;

}Check out this Pen!

[hendrix940]

correct? THANK YOU SO MUCH!!

[hendrix940]

Okay, yes I think I understand. I’m trying it out right now sir.

[hendrix940]

@chrisp , I’m doing something wrong. Here’s the HTML:

<div class="separator" style="clear: both; text-align: center;">

<a style="clear: right; float: right; margin-left: 1em; margin-bottom: 1em;" imageanchor="1" href="http://simeonhendrix.com/images/boogeyman-poster-movie.jpg">

</div>Check out this Pen!

And this is the CSS that blogger automatically is generating. You’ll also notice I tried to implement your instructions but it didn’t remove the margin-bottom.

element.style {

clear: right;

float: right;

margin-bottom: 1em;

margin-left: 1em;

}



The above code is what blogger is automatically generating for me.



I tried:



.separator {

margin-bottom: 0 !important;

}



But this doesn't remove the 'margin-bottom'Check out this Pen!

[hendrix940]

Furthermore, when I got into the HTML/CSS of the blogger, I can’t edit and modify ‘ELEMENT.STYLE’

[hendrix940]

AH!! Thanks so much dude!!

[Author]

Posts