当屏幕宽度小于991像素时，如何减小图像中虚线边框的大小？

Question

当屏幕的宽度最大为991 pixels时，我试图使第二个图像链接中的虚线边框看起来像第一个图像中的虚线边框。 我认为包含单词和数字的div是块状的，也许这就是为什么它需要100％的宽度。以下是带有虚线框的卡片组件部分。

第一张图片 https://imgur.com/a/v8vTveg

第二张图片 https://imgur.com/a/RxdU8zN

我尝试更改类text-truncate的div以及数字和“​​ tl”的div来显示：内联块，但它们仍占据容器宽度的100％，我该怎么办？

<div class="price adsl-price">
     <div class="row no-gutters mt-2">
       <!-- <div class="col">1 AYLIK 170t</div>  -->
               <div class="col lira border-dash-left">
                  <span class="month">3</span>
                  <span class="text-truncate">AYLIK</span> 
                  <div>490tl</div>
               </div>

               <div class="col lira border-dash-left"> 
                  <span class="month">6</span> 
                  <div class="text-truncate">AYLIK</div> 
                    <div>950tl</div>
               </div>

               <div class="col lira border-dash-left">
                  <span class="month">12</span>
                  <div class="text-truncate">AYLIK</div>
                  <div>1550tl</div>
               </div>                
     </div>
</div>