我想这样做:image
我的问题是我需要隐藏get out of bounds在x轴上，那将是content::before是在两个div的顶部。
据我所知，这是设计中常见的元素，我想知道如何做得更好。
section.another {
height: 200px;
background-color: #51D145;
}
section.out-mission {
position: relative;
overflow-x: hidden;
padding-bottom: 50px;
}
section.out-mission::before {
content: url("https://fakeimg.pl/200x200/");
position: absolute;
top: -100px;
right: -100px;
}
p.text {
line-height: 150%;
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<section class="another">
</section>
<section class="out-mission">
<div class="container">
<div class="row">
<div class="col-12">
<h2 class="section-title">
our mission
</h2>
</div>
<div class="col-12">
<p class="text">
НПФ «НОРД» – разработчик уникального направления, на основе регулируемых газовых сред (РГС), в
области производства экологически-чистого продукта.
</p>
<p class="text">
Технология РГС позволяет производить в промышленных масштабах, свободные от болезней и патогенов,
качественные и полезные продукты (на этапах выращивания, переработки и хранения):
</p>
<p class="text">мясо и птицу без использования антибиотиков и гормонов; овощи и зеленые культуры без
применения пестицидов и агрохимикатов.</p>
</div>
</div>
</div>
</section>
</body>
</html>请查看下面的代码链接希望它对你有用。我们在两个部分上都添加了一个div，并将overflow-x: hidden赋给div。
请参考此链接:https://jsfiddle.net/yudizsolutions/bLhu0qcm/