body backgroundchannel opacity on
This article was written in 2013. It might or it might not be outdated. And it could be that the layout breaks. If that’s the case please let me know.
I like the
hsla() colour notation. I like it a lot. It’s easy. First you pick a hue (a colour), then you decide how light or dark it should be, and how saturated the colour must be. And the a stands for alpha channel, which means transparency. I use the alpha channel to create lighter versions of the same colour, or to blend the color with the layer behind it.
There is a fascinating bug in the Windows Phone browser. If you use the alpha channel on the background of the
body your page turns into web art. Which looks cool, but is completely unusable.
Yes, that’s a picture of this site you’re looking at. That’s what it looked like this morning.
The solution is easy. Don’t use the alpha channel. Or set it to 1. Or convert the colour to a solid
hsl() notation, or a completely different notation. The other solution is to set the background of the
html element to a solid colour, like