Question

每当我调整网页大小时，技能中的文本都会溢出到下一个容器。我不知道如何解决这个问题。有任何想法吗？

这是HTML：

  <div id="skills">
     <div class="container-fluid">
       <div class="row">
       <div class="col-md-4">
         <img class="img-circle" src="placehold.it/150x150">
         <h2>Skill 1</h2>
         <p>orem ipsum dolor sit amet, ad diam detracto eloquentiam eam, cum ei noster comprehensam. Ei est zril labores epicuri, vel ferri denique neglegentur ex. Malis feugiat denique cu vim. Ei mel nisl dolorum, ridens laoreet repudiandae qui </p>
         </div>
         <div class="col-md-4">
         <img class="img-circle" src="placehold.it/150x150">
         <h2>Skill 2</h2>
         <p>orem ipsum dolor sit amet, ad diam detracto eloquentiam eam, cum ei noster comprehensam. Ei est zril labores epicuri, vel ferri denique neglegentur ex. Malis feugiat denique cu vim. Ei mel nisl dolorum, ridens laoreet repudiandae qui </p>
         </div>
         <div class="col-md-4">
         <img class="img-circle" src="placehold.it/150x150">
         <h2>Skill 3</h2>
         <p>orem ipsum dolor sit amet, ad diam detracto eloquentiam eam, cum ei noster comprehensam. Ei est zril labores epicuri, vel ferri denique neglegentur ex. Malis feugiat denique cu vim. Ei mel nisl dolorum, ridens laoreet repudiandae qui </p>
         </div>
       </div>
     </div>
   </div>

CSS：

#skills{
max-height: 100%;   
text-align: center;
background: #f6f6f6;
height: 300px;
padding-top: 50px;}

Answer 1

设置max-height可能不是一个好主意，如果你想让控件在盒子里自然流动，没有任何可视化的例子，所以很难知道发生了什么。你可以检查元素并确认内容是否溢出到DOM级别的下一个div（可能是一个灵活的东西），或者它只是突破它的盒子，因为你正在放置一个最大高度，内容无处可逃。

在页面调整大小期间，Bootstrap 3文本进入下一个容器

1 个答案: