Is it possible to have a background image on the Bodytag, and then add blur filter on it, whitout getting the blur effect on the div's thats inside the body ?
Or do U need to add it on the first div inside the body as I can see many ex. on ?
Using CSS filters, all child elements of the element being blurred will also be blurred. However, rather than clutter your markup with an extra div just for the sake of a bg image with blur, you can use a pseudo element.
Don't forget to give it a z-index below the other content. In this case I just used -1, but you could use any number and give the other elements another number higher.
CSS
body:before {
content: '';
z-index: -1;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
-webkit-filter: blur(10px);
background: url(http://hackingui.com/wp-content/uploads/2014/05/meng2-1980x1000.jpg) no-repeat;
background-size: cover;
}
Check it out on codepen
