День добрый! Прошу помощи, чтобы разобраться в причинах того, почему изображение, которое я хочу установить как
background , накладывается на мой блок?
<section class="block-contagion">
<div class="wrapper">
<div class="title-block__contagion">
<h3>Covid-19</h3>
<p>Contagion</p>
<p>Corona viruses are a type of virus. There are many different kinds, and some cause disease. A newly identified type</p>
</div>
<div class="virus-transmission">
<div class="test">
<img src="/assets/image/content/air-transmission.svg" alt=''>
<h3>Air Transmission</h3>
<p>Objectively evolve tactical expertise before extensible initiatives. Efficiently simplify</p>
</div>
<div class="test">
<img src="/assets/image/content/human-contact.svg" alt=''>
<h3>Human Contacts</h3>
<p>Washing your hands is one of thesimplest ways you can protect</p>
</div>
<div class="test">
<img src="/assets/image/content/Noise-rag.svg" alt=''>
<h3>Containted Objects</h3>
<p>Use the tissue while sneezing,In this way, you can protect your droplets.</p>
</div>
</div>
</div>
</section>
.block-contagion {
background: url('/assets/image/bg/contagion.svg') 6% 85% no-repeat scroll;
}
.virus-transmission {
display: flex;
flex-direction: row;
justify-content: space-between;
padding: 0 200px;
}
.test {
display: flex;
flex-flow: row wrap;
justify-content: center;
width: calc(100% / 3 - 30px);
border: 1px solid;
border-radius: 10px;
border-color: #fff;
box-shadow: 0px 15px 40px rgba(0, 0, 0, 0.22);
box-sizing: border-box;
padding: 0 10px;
}