CSS/Bootstrap响应式设计段落

Question

我正在基于 Bootstrap 模板开发网站。 这是 link：http://pixelslab.pl/ly/ 我只是对中间的段落有问题——它们以奇怪的方式重叠。 知道如何解决吗？

screenshot of issue

Answer 1

为了使它们按预期工作，您应该在某个断点（例如767px）中将默认值line-height设置为正常。您还应该将 flex-direction: column; 应用于父元素以获得更好的结果。所以结果应该是这样的：

@media only screen and (max-width: 767px) {
      .elementor-text-wrap .section {
        flex-direction: column;
      }
      .section p {
        font-size: 14px;
        line-height: normal;
      }
    }
}

Answer 2

固定高度导致此...更改您的 CSS 以下内容：

@media screen and (max-width: 766px){
    .elementor-text-wrap .section
    {
    height: auto;
    min-height: 200px;
    padding-top: inherit    
    }
}