[csswg-drafts] [css-content] Does `content: url()` apply to images?

emilio has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-content] Does `content: url()` apply to images? ==
Blink and WebKit implement `content: url()` allowing to replace an element with an image.

However the behavior differs and doesn't look quite intentional, and WebKit's behavior looks different if the image is already loaded or not (the second image would display alt text after a relayout, wat).

Consider this test-case:

```html
<!doctype html>
<img src="broken" style="content: url(https://www.w3.org/2008/site/images/logo-w3c-mobile-lg)" alt="This is my alt text">
<img src="https://www.w3.org/2008/site/images/logo-w3c-mobile-lg" style="content: url(broken)" alt="This is my alt text">
```

How should this render? Should `content: url()` apply or not? If it does, should it display the `alt` text? Why only for `<img>` (if the image is broken in a `<div>`) it just doesn't render?

Also, note that in Blink at least, if the image is already loaded for the second `<img>`, or if you toggle `display` manually, suddenly it displays the image instead of the `alt` text.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2831 using your GitHub account

Received on Wednesday, 27 June 2018 11:22:08 UTC