1686738 - <figure> vary width when apply certain styles

Status: RESOLVED INVALID

(Core :: DOM: CSS Object Model, defect)

Description

[ortiz]

Attachment: Screenshot.

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.16; rv:85.0) Gecko/20100101 Firefox/85.0

Steps to reproduce:

(Firefox Developer Edition – 85.0b6)

<figure> actual dimensions: 1360x0
First, apply the following style for <figure>:
figure { display: none }

Then, apply the following @media rule and style for <figure>:
@media (min-width: 1000px) { figure { display: initial } }

Actual results:

Now, <figure> apparently has dimensions of 0x16.

Expected results:

Should return 1360x0 instead of 0x16.

It's necessary to put figure { display: block } inside @media rule to see 1360x0 again, although initial value is semantically more correct.

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

Bugbug thinks this bug should belong to this component, but please revert this change in case of error.

Comment 2

[Emilio Cobos Álvarez [:emilio]]

No, display: initial is always just display: inline. You want display: revert, which accounts for user-agent stylesheets.