CSS issues

I have a css question. You can see in the post below this one that both the photos are over to the right. They have the attribute class=”alignright”. Now I wanted one on the left, and one on the right, but when I did that, the one on the left didn’t have the pretty purple border. I’ve looked at the code, and the alignright and alignleft are exactly the same except for the margin placement. Either I need some nutritional supplements to improve my vision to some to improve my mental processing, because I am totally not understanding this. Any ideas? Here’s the code:

img.alignleft {
float: left;
display: inline;
margin: 0px 7px 2px 0px;
padding: 4px
border: 1px solid #996699;
background-color: #666699;
}

img.aligncenter {
padding: 4px;
border: 1px solid #996699;
background-color: #666699;
text-align: center;
}

img.alignright {
float: right;
display: inline;
margin: 0 0 2px 7px;
padding: 4px;
border: 1px solid #996699;
background-color: #666699;
}