We are using a blur effect on cover images and in order to remove the blurry border created with the CSS blur filter we are using overflow hidden. Our code is setup like this:
The container has overflow hidden and is set to have the dimensions of the page with position relative.
The img-holder is positioned absolute with negative top, right, bottom, left values
img has a background image with the blur filter
This works like a charm in the browser when viewing print preview, but it looks like the scale effect used to create the overflow of the image is not applied in prince. See my attached minimal example.
<div class='container'>
<div class='img-holder'>
<div class='img'>
</div>
</div>
The container has overflow hidden and is set to have the dimensions of the page with position relative.
The img-holder is positioned absolute with negative top, right, bottom, left values
img has a background image with the blur filter
This works like a charm in the browser when viewing print preview, but it looks like the scale effect used to create the overflow of the image is not applied in prince. See my attached minimal example.