Skip to content

Instantly share code, notes, and snippets.

@jstrieb
Created February 18, 2021 02:26
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jstrieb/ccb5c73ff92be6bc066145e80f517313 to your computer and use it in GitHub Desktop.
Save jstrieb/ccb5c73ff92be6bc066145e80f517313 to your computer and use it in GitHub Desktop.
GitHub Stylesheet <details> Problem Demo

This is a (minor) bug report.

On github.com, with the default GitHub stylesheet, the <details> tag only has cursor: pointer if a <summary> tag is included explicitly. If there is no <summary> tag, the cursor does not indicate that the dropdown is clickable. Here is an example of the incorrect style:

This is a test

The code for this incorrect version is:

<details>

This is a test

</details>

Compare that to explicitly including a <summary> tag, which behaves the way it is supposed to:

Details

This is another test

The code for the second example is:

<details>

<summary>Details</summary>

This is another test

</details>

This can be fixed by adding the following CSS to the stylesheet:

details {
  cursor: pointer;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment