Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS targeting specific images

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.

like image 323
Nils Munch Avatar asked Jul 14 '26 08:07

Nils Munch


1 Answers

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.

like image 98
Ibu Avatar answered Jul 18 '26 06:07

Ibu



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!