Archive September 2016

CSS blur overlay

Unfortunately it is not possible to create a real blur overlay with CSS for all browsers at the moment. Only webkit has the backdrop-filter. But all other browsers mostly support a blur filter. This will not really work like a overlay, more like a filter that will be propagated bottom-up. In other words, the filter works only for a hole element or not. It's impossible to have something like a div overlay element that blurs only a part of an image like the backdrop-filter.

Continue reading

CSS background transitions with image sprites

You will start thinking about image sprites, if you see that your website has too many requests just because of some background images. An image sprite can combine many single requests from a browser to the server into one request. We just have to combine our background images into one single image and use the CSS property background-position. It's just getting complicated if you have a transition on the background.

Continue reading