I have a JPEG file that I'm using as a background image for a search page, and I'm using CSS to set it because I'm working within Backbone.js contexts:
background-image: url("whatever.jpg");
I want to apply a CSS 3 blur filter only to the background, but I'm not sure how to style just that one element. If I try:
-webkit-filter: blur(5px);
-moz-filter: blur(5px);
-o-filter: blur(5px);
-ms-filter: blur(5px);
filter: blur(5px);
In my CSS, it styles the entire page rather than just the background, just below background-image. Is it possible to choose just the image and use the filter on it? Or, is there a method to simply disable the blur for every other component on the page?