Всем привет!
Подскажите, пожалуйста, почему появляется скрол при позиционировании декоративных эелементов?
https://monosnap.com/file/X29sqIeDETeGNOGwbWyyuS35...
<div class="about__inner">
<img class="about__decor" src="images/decor/about-left.svg" alt="">
<img class="about__decor" src="images/decor/about-top.svg" alt="">
<img class="about__decor" src="images/decor/about-right.svg" alt="">
<img class="about__decor" src="images/decor/about-center.svg" alt="">
<h2 class="about__title big-title">Lorem ip</h2>
<p class="about__text">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga in facere modi. Odit aut, qui eaque, nam, impedit cumque consequuntur deserunt laborum autem incidunt soluta dolores dolorum voluptatum dolorem vel!
предоставляемых услуг.
</p>
</div>
.about__inner {
padding: 120px 0;
text-align: center;
position: relative;
}
.about__decor {
position: absolute;
z-index: -1;
}
.about__decor:nth-child(1) {
left: -60px;
top: 50%;
transform: translateY(-50%);
}
.about__decor:nth-child(2) {
top: -140px;
left: 50%;
transform: translateX(-100%);
}
.about__decor:nth-child(3) {
right: -60px;
top: 50%;
transform: translateY(-50%);
}
Скрол появляется только когда задаю 3-му элементу right: -60px;
Для первых двух скрола нет. Подскажите, пожалуйста, в чем может быть проблема?
