The AvatarBlocks module wraps each individual user's avatar display with a div that has a class name of userpicture. You can use the following selectors to target CSS directives:

• .userpicture
• .userpicture a
• .userpicture a img

AvatarBlocks provides a very simple default style sheet that contains the following CSS code:

.userpicture {
  float: left;
  line-height: 0;
}

.userpicture a {
  display:block;
  border: 2px solid #fff;
}

.userpicture a:hover {
  border: 2px solid #bbb;
}

.userpicture img {
  margin: 0;
}

You can override or amend these styles in your theme style sheet to change the appearance of the default AvatarBlocks display.

The blocks on this demo site use the default AvatarBlocks styling. Each avatar is floated left, and the number of avatars in each row is dictated by the size of the images and the width of the region.