Bug 72936 – images inserted using content: url( ... ) shouldn't be resized

• Component: CSS
• Status: RESOLVED CONFIGURATION CHANGED

[Florian Rivoal]

Created attachment 116197 [details]
Test case showing the problem.

As defined in CSS 2.1 (section 12.1 an 12.2), images inserted using content: url( ... ) shouldn't be affected by the width and height set on the (pseudo) element.

With CSS 3 inserting them becomes possible on non pseudos, as introduced by Bug 9827, but they still shouldn't be affected by the width and height set on the element. CSS3-content may lead to think otherwise, but that spec is old and broken, and should not be trusted.

See the following thread on www-style for details about this: http://lists.w3.org/Archives/Public/www-style/2011Nov/0451.html

[Tab Atkins]

More specifically, the 'content' property on elements is acting differently than the 'content' property on pseudos, and the pseudo behavior is correct.  An image used in 'content' should generate an anonymous inline box inside the element (which is then unsizeable manually and only uses its intrinsic size).  Instead, when used on elements, we are turning the element into a replaced element like <img>.

This also means that we're unable to mix both images and text in 'content' on elements, while we can with pseudos.

[Ahmad Saleem]

Created attachment 460304 [details]
Safari 15.5 matches other browsers

I am unable to reproduce this bug in Safari 15.5 on macOS 12.4 considering it is matching all other browsers based on attached test case and results can be referred into attached screenshot.

Although, it does not match "Expected Results' and show "Green box within large red box", while expected result is the whole box to be green and no red.

If I am testing incorrectly, please retest it but since all browser behavior is aligned now. It can be marked as "RESOLVED INVALID" or "RESOLVED CONFIGURATION CHANGED". Thanks!

[Radar WebKit Bug Importer]

<rdar://problem/95403471>

[Ryosuke Niwa]

Config changed. All browser's behaviors match.