5

If I define the following CSS rule:

img {
    max-width:  200px;
    max-height: 200px;
    border: 1px solid black;
}

Is there a pure-CSS way of detecting those image objects that would have been larger without the size constraints? Something that semantically matches:

img:resized {
    border-color: green;
}

Alternatively: is there a way of only detecting large images in the first place? For example:

img {
    border: 1px solid black;
}
img[width>200px], img[height>200px] {
    max-width:  200px;
    max-height: 200px;
    border-color: green;
}

Thanks!

Matty K
  • 3,563
  • 1
  • 21
  • 19

1 Answers1

9

No, there are no CSS selectors that can query style properties, whether declared or computed, as rendering of DOM elements has no relation to the DOM hierarchy.

BoltClock
  • 665,005
  • 155
  • 1,345
  • 1,328
  • Why did this answer get marked down? It is the correct answer. – joshnh Aug 22 '11 at 04:59
  • Huh, at least I explain my downvotes, unlike someone else, whoever it is. I don't give a crap though; I'm Alt+Tabbing between SO and a TF2 Dodgeball game so whatever. – BoltClock Aug 22 '11 at 04:59
  • @BoltClock: *Is* someone targeting you and your beloved [css-selectors]? It looks coincidental. Your "why downvote" comments are longer than your answer :o – thirtydot Aug 23 '11 at 13:56
  • @thirtydot: I'll never know, and I don't usually respond to downvotes anymore — but this particular one was situationally amusing to the point that I just *had* to write something ;) – BoltClock Aug 23 '11 at 14:01