0

I wondered if anyone has come across this problem I'm having and might be able to point me in the right direction...

I have an image slider and each li within it contains the following:

    <li class="web">
        <div class="cd-full-width square">                  
            <h1 class="slider">Something interesting here</h1>
            <h2 class="letter">Something not as interesting here</h2>
            <a href="/website-design.htm" class="cd-btn button">More</a>
        </div> 
        <div class="bg">&nbsp;</div>
    </li>

Each <div class="bg"> has a background image and I'm applying filter: blur(5px); to the div.

The blur works fine but I now seem to have an inset box-shadow around that div which I don't want.

Example of box shadow here

I've tried to hide the shadow with by including box-shadow or -webkit-drop-shadow set to 0 / none. This doesn't seem to work.

Any ideas welcome! Thank you :-)

Jane
  • 1
  • 1
  • 1
    Welcome to Stack Overflow! Questions seeking code help must include the shortest code necessary to reproduce it **in the question itself**. See [**How to create a Minimal, Complete, and Verifiable example**](http://stackoverflow.com/help/mcve) – Paulie_D Jan 28 '16 at 10:28
  • Related - http://stackoverflow.com/questions/12224320/defined-edges-with-css3-filter-blur – Paulie_D Jan 28 '16 at 10:35
  • Thanks Paul for the related question. My problem was not a box-shadow but indeed the blurred edges. – Jane Jan 28 '16 at 11:25

0 Answers0