Browser (Engine) design compatibility

[tigexplorer]

Platform: Ubuntu 22.04 LTS
Server type: Apache2 ...
PHP version: 8.1

Is there a way for better browser compatibility of custom styled buttons?
See screenshots of
Gecko/ Firefox

Blink/ Chromium

and WebKit/ Epiphani

[JulianPrieber]

@tigexplorer I haven't had the time to investigate this sooner.
I cannot reproduce this. However, I cannot confirm for Safari.

But we specifically use WebKit syntax to assure maximum compatibility. Especially Chromium and WebKit should have no problem handling it. The only engine that I could imagine this causing errors is Firefox.

I'm not entirely sure how to continue with this.

[tigexplorer]

But we specifically use WebKit syntax to assure maximum compatibility. Especially Chromium and WebKit should have no problem handling it. The only engine that I could imagine this causing errors is Firefox.

Hm, as you can see in the screenshots above, Firefox is the only one, that renders the buttons correctly.

[tigexplorer]

Here is a screenshot of the style preview (Firefox/ Desktop) and the final display on Chrome for Android 13.

On Chrome for Android and Desktop (Linux), the buttons styled with a custom color gradient are not displayed correct

For example, the last two buttons, that are only visible with Firefox, are styled like this
padding-top : inherit; padding-bottom :inherit; padding-left :inherit; padding-right :inherit; color :#140e14; background-image :-moz-linear-gradient(45deg, white 0%, #888888 100%); border-radius :8px; font-size :inherit; font-family :inherit; border-color :inherit; border-style :inherit; border-width :inherit;

[tigexplorer]

But we specifically use WebKit syntax to assure maximum compatibility. Especially Chromium and WebKit should have no problem handling it. The only engine that I could imagine this causing errors is Firefox.

It seems, that's the opposite!

The graphical editor produces -moz-linear-gradient instead of -webkit-linear-gradient for example.
It's controllable in the text box of the css code style editor.

[JulianPrieber]

The editor has a CSS section that even displays what exact styling is used. I'm not sure how this would produce something like that.

Our normal button styling does not include the WebKit styling, so switching tot hat instead might actually improve things.

[JulianPrieber]

The editor chose the styling depending on your browser.
Should be fixed now. This will be included in the next version.