【发布时间】：2021-04-01 15:53:47
【问题描述】：
我正在使用购买的模板开发网站。一切似乎都很完美。但是，我对 html 代码的一部分有疑问，它在正常屏幕尺寸下工作正常，但在超宽屏幕尺寸下，div 尺寸缩小为条带。下面的图片证明了这一点：
当屏幕超宽时，例如在屏幕超过 15 英寸的设备中，div 的外观如下：
然而，我的主要挑战是我真的不知道哪个属性从 css 文件中控制它。我尝试从 chrome 检查代码，最一致的属性是 box-sizing 属性，值设置为 inherit。让我分享一下 div 的这一部分的 html 代码，以便更清楚。
<section class="gray pt-5 pb-0">
<div class="container">
<div class="row">
<div class="col text-center">
<div class="sec-heading mx-auto">
<h2>What People say About Us</h2>
<p>Vukaplus has transformed many businesses and has moved many forward socially and financially.</p>
</div>
</div>
</div>
<div class="row m-0">
<div class="owl-carousel" id="testimonials">
<!-- Single Testimonials -->
<div class="item">
<div class="testimonial-box">
<i class="fa fa-quote-left"></i>
<p>Vukaplus helped us sell our house with minimal effort. Their team was efficient and always there to help!</p>
<div class="client-thumb-box">
<div class="client-thumb-content">
<div class="client-thumb">
<img src="{% static 'base/assets/img/testimonials_property.jpeg' %}" class="img-responsive img-circle" alt="">
</div>
<h5 class="mb-0">Brian Inchedi</h5>
<span class="small-font">Real Estate Agent</span>
</div>
</div>
</div>
</div>
<!-- Single Testimonials -->
<div class="item">
<div class="testimonial-box">
<i class="fa fa-quote-left"></i>
<p>Vukaplus has provided a platform to showcase our daycare business. After listing the business on the platform, we have never stopped receiving new clients!</p>
<div class="client-thumb-box">
<div class="client-thumb-content">
<div class="client-thumb">
<img src="{% static 'base/assets/img/testimonials_business.jpeg' %}" class="img-responsive img-circle" alt="">
</div>
<h5 class="mb-0">Irene Wambui</h5>
<span class="small-font">Happy Baby Day Care</span>
</div>
</div>
</div>
</div>
<!-- Single Testimonials -->
<div class="item">
<div class="testimonial-box">
<i class="fa fa-quote-left"></i>
<p>My car couldn't sell in a yard for 3 months. The day I listed it on Vukaplus, I received a customer instantly with a better offer than I wanted.</p>
<div class="client-thumb-box">
<div class="client-thumb-content">
<div class="client-thumb">
<img src="{% static 'base/assets/img/testimonials_vehicle.jpeg' %}" class="img-responsive img-circle" alt="">
</div>
<h5 class="mb-0">Teddy Kimani</h5>
<span class="small-font">Car Sales Person</span>
</div>
</div>
</div>
</div>
<!-- Single Testimonials -->
<div class="item">
<div class="testimonial-box">
<i class="fa fa-quote-left"></i>
<p>My client wanted a potential candidate for a vacancy he had in his company. A single post on Vukaplus gave me overwhelming applications and I got the right candidate.</p>
<div class="client-thumb-box">
<div class="client-thumb-content">
<div class="client-thumb">
<img src="{% static 'base/assets/img/testimonials_recruitment.jpeg' %}" class="img-responsive img-circle" alt="">
</div>
<h5 class="mb-0">Margaret Wada</h5>
<span class="small-font">Recruiting Agent</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>请指教，因为我在前端不是那么好。 css 文件太大，无法在此处共享代码，但我可以获取 html 部分使用的部分的片段。谢谢。
编辑：添加 CSS 代码片段
所以，我已将代码复制到 JSFiddle，链接如下： Code snippets on JSFiddle
【问题讨论】：
-
不幸的是，我们看到了 CSS 萌芽。如果你可以在某个地方打开它的链接，我会看看它。目前以你所拥有的，我只能猜测。这可能与@media 屏幕和（最大宽度：480px）有关，但无法确定。
-
@AjayChambers 有没有办法可以建议我链接 CSS 文件？我很乐意这样做。
-
你可以将你的 CSS 文本添加到 sn-p
-
您可以添加指向您正在构建的网站的链接。
-
能否分享一下您使用的模板链接？
标签： html css twitter-bootstrap bootstrap-4