How to resize attribute images which are too large?

[sports guy]

I am trying to limit my attribute images to max: 300px wide. But when I attempt to modify css (namely: .attribImg {max-width:300px;} the images resizes nicely as far as width, but the max height stays on my responsive template, totally stretching the image and even overlapping.

Perhaps someone could give me a pointer here as to the proper height resize method to match the max width-height.

[Website Rob]

image { max-width:100%; height:auto }

Best to always use the two together.

[mani]

I have used the following

/*Attributes*/
.attribImg {
max-width:300px;
height:auto;
margin: 0.3em 0em;
}

and attribute images are still very big. This css has no effect on them. Where do I go to fix them?