Search code examples
csswebkitcross-browserrendering-engine

What is WebKit and how is it related to CSS?

More recently, I have been seeing questions with the tag "webkit". Such questions usually tend to be web-based questions relating to CSS, jQuery, layouts, cross-browers compatibility issues, etc...

So what is this "webkit" and how does it relate to CSS? I have also noticed a lot of -webkit-... properties in the source code for various websites. Are these two related?

Update

So from the answers so far... WebKit is a HTML/CSS web browser rendering engine for Safari/Chrome. Are there such engines for IE/Opera/Firefox and what are the differences, pros and cons of using one over the other? Can I use WebKit features in Firefox for example?

The ultimate question... Is WebKit supported by IE?

Update 2

All of the major browsers use different rendering engines. I guess this is a big reason why there are so many cross-browser compatibility issues!

So, is there some kind of project or movement to a standard rendering engine that ALL browsers will use? Will HTML5 bring an end to the cross-browser compatibility issues?

Solution

  • Update: So apparently, WebKit is a HTML/CSS web browser rendering engine for Safari/Chrome. Are there such engines for IE/Opera/Firefox and what are the differences, pros and cons of using one over the other? Can I use WebKit features in Firefox for example?

    Every browser is backed by a rendering engine to draw the HTML/CSS web page.

    • IE → Trident (discontinued)
    • Edge → EdgeHTML (clean-up fork of Trident) (Edge switched to Blink in 2019)
    • Firefox → Gecko
    • Opera → Presto (no longer uses Presto since Feb 2013, consider Opera = Chrome, therefore Blink nowadays)
    • Safari → WebKit
    • Chrome → Blink (a fork of Webkit).

    See Comparison of web browser engines for a list of comparisons in different areas.

    The ultimate question... is WebKit supported by IE?

    Not natively.