Hide disabled <input> instead of using pointer-events: none
Keyboard and other means can still navigate to the inputs, which looks like a bug.
Drop <br> and add appropriate paddings (opinionated)
This is not perfect on Chrome because when toggling the inputs the options dialog will jump because of height change. Firefox will stretch the page to adjust to the change but Chrome seems to need special layouts to achieve that (need to drop float, but when I use flexbox the problem reappeared so I gave up 😞)
<input>instead of usingpointer-events: noneKeyboard and other means can still navigate to the inputs, which looks like a bug.<br>and add appropriate paddings (opinionated) This is not perfect on Chrome because when toggling the inputs the options dialog will jump because of height change. Firefox will stretch the page to adjust to the change but Chrome seems to need special layouts to achieve that (need to dropfloat, but when I use flexbox the problem reappeared so I gave up 😞)