Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How can i remove shadow around screen from filter blur() in css?

enter image description here

How to delete this shadow around screen ???
Filter blur does this shadow

      &::before {
        content: "";
        position: absolute;
        background: linear-gradient(to right, rgba(11, 11, 11, 0.766), rgba(11, 11, 11, 0.766)) , url('/Obrazek\ 1.jpeg');
        background-repeat: no-repeat;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-color: black;
        filter: blur(20px);
      }

I tried using backdrop filter but its not working

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

>Solution :

Use backdrop-filter or negative indent for filter block:

body {
  position: relative;
  background: linear-gradient(to bottom, blue,yellow);
  display: grid;
  place-items: center;
  min-height: 100dvh;
  padding: 16px;
  margin: 0;
}

body:after {
  content: '';
  position: absolute;
  background: rgba(11, 11, 11, 0.2);
  inset: 0;
  backdrop-filter: blur(2px);
}
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis, corporis, eos, eaque ex ad porro provident vel iusto dolor accusamus quo dolore animi odit dolorum vero aspernatur magnam rerum hic optio illum est soluta deserunt maiores in ut. Voluptatibus, quod, et, quae quas asperiores quis id rerum molestias reiciendis exercitationem magnam ipsam iusto atque doloremque recusandae laboriosam eveniet voluptatum cumque ipsum est! Perferendis, cupiditate, architecto a cumque libero nihil ut in modi iste magnam fugit porro nulla cum qui ab!
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading