firefox integration

[pvidalis]

Hi to all,
I'm a web developer using Kubuntu.
It seems that firefox in KDE shows buttons, inputs, etc. a bit different than other browsers.
I did some research to figure out how to fix this with no success.
I found a lot of posts where people talking about gtk engines issue etc but most of them are outdated.

Is there any way to integrate firefox with KDE and correct these problems?

Kind Regards
Petros

[chimak111]

Something about integration: https://www.reddit.com/r/kde/comment...pdate_on_that/

[jglen490]

Firefox is not a KDE application, nor is it Gnome, or Mate, nor Xfce, nor any other DE-specific. It works well inside the OS that it's complied for and it works well with each DE, but as far as "integration", it's not going to happen.

[whatthefunk]

It shows buttons, forms etc different on all operating systems, not just in Kubuntu. All browsers are a bit different in how they render html elements. Usually, a CSS reset at the beginning of your CSS will help correct this.

[Goeroeboeroe]

Since you're writing about buttons and inputs I guess you're talking about websites, not about the interface of Firefox itself.
Every browser on every system has her own default styling etc. Chrome on Windows looks different than Chrome on OS X, etc.
It's very hard, almost impossible, to style form elements like buttons and inputs looking everywhere the same. For example: if you change the width and height in a <input type="checkbox"> Firefox on LInux changes not the square checkbox itself, but changes the margins. Google Chrome on Linux on the other hand changes the square checkbox itself.
Unless you've very good reasons to change the default appearance, it's best to leave them like they are, because people are used to it.
Here are some links to articles about styling form elements:
https://css-tricks.com/sliding-night...g-range-input/
https://www.sitepoint.com/replacing-...radio-buttons/
A bit older, but this gives a good idea why styling is so difficult (every browser vendor uses their own names, some things can't be changed in some browsers, etc.):
https://www.tjvantoll.com/2013/04/15...form-controls/

If I really, really, really have to do something with <input>, I hide the original input and replace it with a fake input using ::before at the associated label. The fake input can be styled just like you want it. But to indicate a checkbox is checked etc, the input has to be outside the label, so you can use something like
input:checked + label::after
and put a 'x' in a checkbox (or mark a radio button, etc.)
But when an input is outside the associated label, it's impossible to get the input on exactly the same height as the text in the corresponding label. You can get it almost good in every browser, but not really good in every browser. Because - sigh - every browser behaves different with thing like margin, padding, position, translate(), etc.

If the only problem is inputs etc. look a little different, personally I would just leave it that way.

[jglen490]

Agree. And the OP question was "Is there any way to integrate firefox with KDE and correct these problems?". Still no.

Unless you want dive into the source code and rewrite FF!