cubing.js icon indicating copy to clipboard operation
cubing.js copied to clipboard

`twisty-player` Inconsistent Rendering Issue in Firefox 92.0

Open dunkOnIT opened this issue 4 years ago • 1 comments

To Reproduce Steps to reproduce the behavior:

  1. Open Firefox 92.0
  2. Navigate to https://dunkonit.github.io/cubing.js/getting-started/#html-cube-player [^1]
  3. All embedded twisty-players have the bottom of the player cut off. This persist across changes to the height/width of the element (see Image 1).

Expected behavior I expect the buttons at the bottom of the player not to be cut off, as is the case in the cubing.js documentation and on Chrome (see Image 2).

Browser:

Comments:

Given that it functions normally on cubing.js/docs/cubing/index.html when opened in Firefox 92.0, I suspect this may be an issue with the CSS template that minimal-mistakes uses. However, Tomas has indicated that there are some known issues with Firefox - so I figured it would be better to post here and give @lgarron a chance to weigh in on troubleshooting strategy before I start taking shots in the dark.

Screenshots

Image 1

image

Image 2

image

[^1]: Edit by @lgarron: The original URL went stale. Updated to the new URL.

dunkOnIT avatar Sep 14 '21 15:09 dunkOnIT

Something funky is happening with the buttons, which have a space of 24px vertically and are set to height: 100% — but seem to be 33px high?!?!

I'll have to take a closer look later.

lgarron avatar Sep 14 '21 20:09 lgarron