7

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,781
  • 2
  • 22
  • 19

1 Answers1

10

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
  • 700,868
  • 160
  • 1,392
  • 1,356
  • 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