normalize.css icon indicating copy to clipboard operation
normalize.css copied to clipboard

In details > summary , current normalize.css makes drop arrows go away in IE and Edge

Open jhodgdon-drp opened this issue 6 years ago • 1 comments

The Drupal 8.x release includes normalize.css, but we've locked in an old version (hard to update and keep backwards compatibility), so we're currently back at version 3.x. At some point, Firefox (judging by issue #604 in this project, it was version 49 or so of Firefox) changed how it did summary elements, and normalize.css apparently changed from using display: block to display: list-item for summary elements around version 5.0 of normalize.css. Drupal doesn't have that change, and I noticed the vanishing arrows in Firefox and filed this issue in the Drupal project about it: https://www.drupal.org/project/drupal/issues/2886904

You have two issues in this project about it, #604 and #640 -- both are closed.

So... We tried two things to resolve our Drupal issue: (a) update to a newer version of normalize (7.0) and (b) just override the summary element to use display: list-item. However, one of our testers tried out our Drupal patch in Internet Explorer and Edge on Windows, and reported that in both browsers, the drop-down triangle icon on summary elements went away with those patches.

And I tested -- in Firefox (I'm currently on version 59), only display: list-item shows the triangles for a summary element inside a details element.

So... I thought I'd better report the issue here. No idea how to resolve it, but it looks like in IE, they need display: block as in the older 3.0 version of normalize.css, and in Firefox, we need display: list-item.

Hopefully that wasn't too long-winded. :)

jhodgdon-drp avatar Apr 06 '18 19:04 jhodgdon-drp

<details>/<summary> isn't supported in IE/Edge; https://caniuse.com/#feat=details

Malvoz avatar Nov 05 '18 20:11 Malvoz