CSS targeting specific images

Question

I am looking for a way to target a specific image with CSS, if this is even possible.

I am running a CMS where the users can upload images and put them on their pages. I would like a way to target images with specific dimensions.

So the question is, can you make a css line target a image or object with certain dimensional specifications ?

I would imagine something like :

img#width:400px { float :left; }

(to make images that are 400 pixels wide have float:left)

I know i could give the image a class or an id, but it would be lost when the customer plays around in the cms.

Answer 1

img[width="400"]{
   float:left;
}

This will make any image that have the attribute set to 400 float left:

<img src="image.jpg" width="400" />

Note: this will only work if the width attribute is set. Will not work if the image is 400px wide but does not have a width attribute set.

Answer 2

According to the spec this should work

img[width=400]

but I haven't tried it