CSS differencing calculator
Calculator compares two style sheet documents (CSS) and finds out differences between them.

# Beta version#

BETA TEST VERSION OF THIS ITEM
This online calculator is currently under heavy development. It may or it may NOT work correctly.
You CAN try to use it. You CAN even get the proper results.
However, please VERIFY all results on your own, as the level of completion of this item is NOT CONFIRMED.
Feel free to send any ideas and comments !

# Settings - how do you want to compare your texts#

 Ignore white characters

# Found differences (CSS)#

// This is somea CSSnew comment↵
body {↵
font-size: 16px15px;↵
color: redblue;↵
}↵
↵
@media (min-width: 512px) {↵
body {↵
font-size: 20px18px;↵
color: greenyellow↵
}↵
}↵


# Compare statistics#

 Summary Comparison method Case sensitive Ignore white characters Compare result Are CSS documents equal no ✗ Are texts equal(strict char-by-char comparison) no ✗ Length of entered texts Length of the first text 152 Length of the second text 151 Differences found in CSS documents Number of added pieces 6 Number of removed pieces 6 Number of unchanged pieces 7

# Some facts#

• The Cascading Style Sheets (CSS) is a way of describing the appearance of websites.
• CSS has the form of a human understandable text.
• Cascading style sheets allow us to separate page content from how it is presented.
• The CSS data includes information such as:
• size, type and font,
• background for the whole page or individual elements,
• visual arrangement of elements relative to each other,
• etc.
• Websites remain valid after removing CSS data from them, however, they may experience difficulties in understanding some visual elements. Browsers working in text mode either ignore CSS data or have little to do with it.

# How to use this tool#

• Simply paste or type-in the two texts you want to compare into the boxes marked first text and second text.
• A list of differences found between the entered texts (if any) will be shown below.

# What is the meaning of each calculator field ?#

• Comparison method - defines the way we should split the text before comparing it, the available options are:
• case sensitive - select this option if you want to perform a case-sensitive comparison, then the words calculla, CALCULLA and CaLcUlLa will be treated as three different words,
• ignore white characters - this option is available only when comparing words, lines or sentences, check this option if the spacing between compared elements (words, sentences etc.) does not matter for you,
• the first text - the original, reference text that we want to compare,
• the second text - modified text in which we are looking for differences to the original one,
• are texts equal - yes, if no difference was found between the entered texts, no - otherwise,
• found differences - list of differences found between the first and second text,
• characters colored in red mean deleted characters (ie those that appear in the first text but do not appear in the second) ,
• characters colored green mean added characters (ie those that did not appear in the first text but appeared in the second),
• characters that remain identical in both texts are presented in standard gray font.

• If you are interested in diff tools, see our other calculators:
• Text compare - compares two texts by character, words, lines or whole sentences,
• JSON compare - compares two documents in JSON format,
• CSS compare - compares two cascading CSS style sheets.