Community

Remove the period on the image element (so just "img" not ".img"). Also you'd want it to be as specific as possible otherwise every image on your entire site (header, sidebar, etc) would have the border around them. Thus try something like the following.

.journal-entry .body img { border: 1px solid #123379; }

BTW here's something else you could try.

.journal-entry .body img { padding: 5px; background-color: #EFEFEF; border: 1px solid #123379; }

What that allows you to do is apply what looks like two borders to the single image. The inner border is actually created from the background color and padding of the image which in turn pushes the CSS border to the outside (and thus making it look like a secondary border).

Oh if you're someone who uses the WYSIWYG editor and inserts images that way, you can take advantage of the outer span tag placed around images to be very specific. So you could use the following instead.

.full-image-float-none img { padding: 5px; background-color: #EFEFEF; border: 1px solid #123379; }

That's just for the "float-none" one. You could also apply it to the "float-left" and "float-right" CSS elements as well if you wanted (as you'd probably want to make those ones have a smaller border since they are usually smaller images floating to the right or left).

Good stuff! Glad it worked out for you. :)