Perch Image Resize in Different Templates

In my posts.html for my collection I have the following

    <perch:content id="postImageCard" type="image" label="Preview Image" required="true" bucket="case-studies" help="Image used to preview the article in cards" suppress="true" crop="true" />
    <perch:content id="postImageCard" type="image" label="Preview Image" bucket="case-studies" suppress="true" width="960" height="540" />

This gives my the original image size of 1920 x 1080 and a resized image of 960 x 540.

I then try to output the 960 x 540 in a listing template:

<perch:content id="postImageCard" width="960" height="540" crop="true" />

This however gives me the original image of 1920 x 1080. What am I doing wrong?