Since you are "interested in having science behind why this happens, if there is an explanation for it" ...
TL; DR:
"Color values" are not "universal."
The abbreviated / abbreviated three-digit hexadecimal form #RGB described in the CSS specification, not in HTML. As a result, the three-digit form in the attribute other than the "style" or inside the <style> is not interpreted as a valid color in some browsers.
https://en.wikipedia.org/wiki/Web_colors
Depth:
I start with the CSS 1 specification, color units (6.3) (since it introduces some terms / concepts, t need to be repeated), which indicates:
Color is either a keyword or a numerical specification for RGB.
Suggested list of keyword names: aqua, black, blue, fuchsia, gray, green, lime, burgundy, navy blue, olive, purple, red, silver, teal, white and yellow. These 16 colors are taken from Windows VGA and their RGB values are not defined in this specification.
BODY {color: black; background: white } H1 { color: maroon } H2 { color: olive }
The RGB color model is used in numerical color specifications. In these examples, the same color is indicated:
EM { color: #f00 } EM { color: #ff0000 } EM { color: rgb(255,0,0) } EM { color: rgb(100%, 0%, 0%) }
The format of the RGB value in the hexadecimal system is denoted as ' # ' immediately followed by either three or six hexadecimal characters. The three-digit RGB symbol ( #RGB ) is converted to six-digit form ( #rrggbb ) by replicating the digits, rather than by adding zeros. For example, #fb0 expands to #ffbb00 . This ensures that white ( #ffffff ) can be specified by a short note ( #fff ) and removes any dependencies in the color depth of the display.
The format of the RGB value in functional notation is ' rgb( ' followed by a list of three numerical values separated by commas (either three integer values in the range 0-255 or three percentage values in the range from 0.0% to 100.0%), and then " ) ". Missing characters are allowed around numeric values.
Values outside of numeric ranges must be truncated. The three rules below are therefore equivalent:
EM { color: rgb(255,0,0) } EM { color: rgb(300,0,0) } EM { color: rgb(110%, 0%, 0%) }
RGB color is specified in the sRGB color space. UAs may vary in the fidelity with which they represent these colors, but the use of sRGB provides an unambiguous and objectively measurable definition of what color should be, which may be related to international standards.
In the CSS context, regarding browser support, only 2 “interesting” things that I could find were:
- All browsers that support stylesheets (version 3 and above, except for IE3 Mac) support this three-character abbreviated form of hexadecimal colors (Sources: 1 , 2 , King AB's Optimize CSS Colors)
Pay attention to the historical timeframe of this text .. IE3 ... on Mac ... Browsers like FireFox 1 or Chrome weren’t even then. - Two
rgb() methods suffer from non-support of Internet Explorer 3 for them
Source: 1 (very readable)
According to HTML4 specification attribute bgcolor was only for <body> , <table> , <tr> , <th> and <td> . (So, as far as applicable to the previous specification, you cannot use it on a <div> for example.)
All of them are of type CDATA : %Color;
which was defined as:
<!ENTITY % Color "CDATA" -- a color using sRGB: #RRGGBB as Hex values --> <!-- There are also 16 widely known color names with their sRGB values: Black = #000000 Green = #008000 Silver = #C0C0C0 Lime = #00FF00 Gray = #808080 Olive = #808000 White = #FFFFFF Yellow = #FFFF00 Maroon = #800000 Navy = #000080 Red = #FF0000 Blue = #0000FF Purple = #800080 Teal = #008080 Fuchsia= #FF00FF Aqua = #00FFFF -->
The magic phrase here is: "color using sRGB : #RRGGBB as Hex values",
If I read this in the specification implementation hat, I have to agree that I don’t see the short three-digit #RGB notation and I wouldn’t implement it (neither would I implement RGB(DDD,DDD,DDD) ).
As for HTML5, the bgcolor attribute is deprecated for all previous (HTML4) specified elements (see above).
This means that with regard to the specification, the format of the actual “color codes” will not change soon.
Output:
Recognizing only a named color (from a specified / supported list) or the "hex triplet" symbol ( #rrggbb format) sRGB colors in the bgcolor HTML attribute is not an error; this is for the specification!
Cross-browser solution: .. see Spec ☺
If someone mistakenly points a short color value for bgcolor to a parsing / rendering mechanism that does not support this, then either nothing happens or an unintended color may be displayed; effectively you entered the 'Land of Chuck Norris ..
First of all, for MS IE and MS Outlook, the color will appear almost black . For example: #ff0 (shorthand) becomes #0f0f00 (instead of #ffff00 ). Another example: #07c will become #00070c , etc.
However, some other implementations turn #ff0 into #000ff0 and #07c to #00007c !! If someone mistakenly indicates the RGB(RRR,GGG,BBB) value RGB(RRR,GGG,BBB) for bgcolor , all kinds of colors may appear, for example RGB(255,255,255) can become a very dark shade of green source , etc.
So, we have a funny example in which Microsoft Internet Explorer (all known versions, including IE11) complied with the specification, and many people still complain ..
I found many errors regarding the "3-digit font reduction for" bgcolor -attribute "(spanning over 15 years), addressed, for example, to MS IE, alternative browsers using the MS IE HTML parsing and rendering engine and most email clients based on local applications / websites such as Gmail (all versions) Outlook (-Express), Lotus Notes, Android, etc. etc. etc. etc. (e.g. 1 , 2 , 3 , 4 , 5 , etc.)
Why complaints / errors?
Since some other browsers (e.g. FireFox, Chrome) did / supported color values in other formats, then #rrggbb in the HTML attribute bgcolor .
Why do others support this?
I have only 2 guesses: (a) It remained from “BrowserWar 1”, where there was one of the battles: “My browser can“ feel ”a higher cr @ p-code than its competitor”, but it will be somewhat more likely ( b) reusing code from a CSS color parser ... Ultimately, I would do it as well
Additionally:
Why is anyone from 2012 still taking care of bgcolor ?
Why is this still causing so many errors and questions?
Reply HTML Email ...
In theory (for an unsuspecting web developer) it is "just HTML and CSS."
In practice, it is surprisingly difficult ( 1 ) to qualify. Think: all the cross-browser issues that have ever existed in the power of 3!
It should work with a much larger number of email clients on multiple platforms (downloadable "legacy" applications that are actually still in use), it should also work in web clients like Gmail, AOL, Yahoo, Hotmail, etc. d. Etc..
Not only should they encode the smallest common denominator imaginable (many methods were considered ancient ten years ago), they should even try to “fit” into the layout / style of some web clients.
Their typical structure is one large background table, then one div, then one main table and nested tables, if necessary ...
To put things in the future, according to litmus (anno 2014):
"It turns out that the most reliable way to encode background colors is to use the HTML bgcolor attribute with a six-digit hexadecimal code on the table and td level"
It’s clear that this “mess” will not appear soon, and a regular / email will be distributed to the web developer ... Therefore, I believe that a good full understanding (and the answer to this question) is still very relevant for 2015 and the near future.
Hope this helps!
PS: MS IE filter: progid:DXImageTransform.Microsoft.gradient also does not accept three-digit values of six-digit abbreviated colors, but now, when one of them reminds that "Color values are not universal", this is not a surprise (and not an error if it is not indicated that it will take such values).