Form buttons and dropdown list element are cut off at 200%

[fredymoko]

On this page: http://wet-boew.github.io/themes-dist/GCWeb/feedback-en.html,
all form buttons and dropdown list are cut off at 200% due to the absolute length units:
input[type="button"], input[type="reset"], input[type="submit"] {
height: 37px;
}

.form-control {
height: 37px;
}

[ghost]

I could not reproduce on the latest Firefox as it appears you're using that browser.

Firefox:

Firefox Version 63.0.1

[fredymoko]

I'm using Firefox Quantum too. To reproduce the issue, in View>Zoom, please check "Zoom Text Only"

[ghost]

Yes with Zoom Test Only the enforced height causes the issue. I wonder if using min-height would fix it without causing any issues on other browsers.

Looking a the scss files it appears this is not a wet override, but coming directly from bootstrap.

See https://github.com/wet-boew/wet-boew/blob/1882dd3df9cefb0d8d64edb22783903ace778edd/src/base/bootstrap-overrides/_base.scss for bootstrap overrides.

[ghost]

There are other open issues too #7744 and #6910 with suggested ways to fix.

The better solution seems to be #7744 (comment).

[nricherbrule]

@bsouster Other tickets exist focusing on this issue. I think this can be closed.

[grifare]

I have applied the fixes pointed out on this discussion to overwrite the existing rules and they worked. Tested IE11, Microsoft Edge 42, Firefox 57 (using zoom text only), and Chrome 75.