[TheLastSuperman]

Hmm making it a circle can be done w/ CSS but all would need to be the same size avatar... gosh I've seen something before css wise that did what you said and made whatever image a perfect circle it may have used some .js as well can't recall but here's a snippet that rounds corners of avatars in posts see if you can tinker with this some (paste @ bottom of additional.css):

.postuseravatar img {
	-moz-border-radius-top{vb:stylevar right}: 10px !important;
	-moz-border-radius-top{vb:stylevar left}: 10px !important;
	-webkit-border-top-{vb:stylevar right}-radius: 10px !important;
	-webkit-border-top-{vb:stylevar left}-radius: 10px !important;
	border-top-{vb:stylevar right}-radius: 10px !important;
	border-top-{vb:stylevar left}-radius: 10px !important;
	-moz-border-radius-bottom{vb:stylevar right}: 10px !important;
	-moz-border-radius-bottom{vb:stylevar left}: 10px !important;
	-webkit-border-bottom-{vb:stylevar right}-radius: 10px !important;
	-webkit-border-bottom-{vb:stylevar left}-radius: 10px !important;
	border-bottom-{vb:stylevar right}-radius: 10px !important;
	border-bottom-{vb:stylevar left}-radius: 10px !important;
}

^ Change the 10px to 50px or your value.

Edit: Ohh and when you're tinkering w/ css and you use additional.css to "overwrite" a default definition, well if it already had a border-radius defined (any css) and you overwrite in additional.css w/o using !important it may not display your changes SO if you ever run into a scenario where you know it should work but it's not simply add !important to the end to ensure it knows "hey this is important to show just like this".