Forums

Join
bbPress Support Forums › Troubleshooting › Putting a border on images

Info

Tags

Putting a border on images

    • Posted 2 years ago #

    I've just added the Allow-Images plugin to a forum to bring a little life to some topics. There's a post you can see at http://mbforum.letsdoo.org/topic/visitors-who-arent-registered#post-17.

    I'm trying to figure out a way to put a 1 pixel grey border around images, like the avatar image on the left has. The avatar has its own CSS formatter, but I'm not so hot with CSS and can't work out how to do it for the image in a post. I've used the usual bbcode [ img ] xyz [ /img ], but putting a CSS format tag in the [ img ] part stops the image from being displayed.

    I guess I could hard code it into the plugin, but any better ideas..?

    Edit:

    Duh. I answered my own question. I just changed the stylesheet

    img.avatar { display: block; border: 1px solid #ddd; border-width: 3px; border-style: double; }

    to

    img, img.avatar { display: block; border: 1px solid #ddd; border-width: 3px; border-style: double; }

    • Posted 2 years ago #

    Put it in your CSS?

    .threadpost img
{
  Your CSS Here
}
    • Posted 2 years ago #

    Cheers Ipstenu - speedy reply! I realised that possibly the img, if defined in the stylesheet, would then be set when rendered. And it was.

    • Posted 2 years ago #

    Rock on :) If you specify it my way (or img.threadpost I imagine), it won't affect images outside of a post.

    • Posted 2 years ago #

    Cheers Ipstenu. I changed the post image so text wraps, and left the avatar as it was;

    img { float: left; border: 1px solid #ddd; border-width: 3px; border-style: double; margin-right: 8px; }
img.avatar { float: none; display: block; border: 1px solid #ddd; border-width: 3px; border-style: double; }

    Amazing how a simple change makes everything look so different.

  6. You must log in to post.