Future Firefox versions will support -webkit CSS code

Jan 2, 2016 12:29 GMT  ·  By

Firefox developers are working on a way to natively support the -webkit prefix inside their browser, just like they support the -moz prefix.

For a long time, browser-specific prefixes existed so that developers could write code that was only executed in a certain browser. This allowed them to target the latest coding standards as soon as they were added to a browser before the coding specification became universal.

In the past we had -moz for Firefox, -webkit for Chrome and Safari, -o for (older versions of) Opera, and -ms for Internet Explorer. While the last two started being phased out by developers as the two browsers started dying, the first two remained in the coding habits of many developers, being still used today, mainly by developers that work with bleeding-edge features.

As WebKit browsers started dominating, more and more developers started using the -webkit prefix primarily, without a fallback for Firefox browsers. This was because developers intentionally targeted only mobile WebKit implementations, or because of bad coding practices and a lack of a proper education in Web design techniques.

Long story short is that more and more developers are forgetting to add the -moz prefixes, or are intentionally leaving it out, without a fallback for browsers like Firefox. This is not a worrisome trend, since the number of developers that do this is small, but that didn't stop Mozilla developers from finding a way to fix the problems caused by this issue.

Firefox Nightly now includes a default fallback strategy for dealing with WebKit-specific code

Features implemented via -webkit prefixed code are often experimental, and not all are supported in Firefox. But most of them are, and because of this, Firefox has decided in the spring of 2015 to run an experiment and support some -webkit prefixes inside its browser, but only for some particular sites.

"This experiment proved successful at making the whitelisted sites usable in Firefox," noted Mozilla's Daniel Holbert, who also said that support for an experimental WebKit emulation engine has been added to Firefox Nightly.

This emulation engine, which can be turned on via the "layout.css.prefixes.webkit" setting in the about:config panel, allows Firefox to read -webkit-prefixed CSS code, and automatically fall back to -moz or standard CSS code, where the feature is also supported in Firefox.

The idea behind this emulation engine comes to provide better support for mobile sites designed specifically for WebKit browsers, and would allow them to be properly rendered on Firefox versions, without developers having to alter their code.

The emulation engine is still under work, and we'll see in upcoming features whether it will come enabled by default, or if it will be deemed stable enough to be added to mobile Firefox versions.