CSS overflow:auto 搞砸了 ios 和 safari

Question

我有一个 div 具有固定的宽度和高度。在这个div里面我还有 6 个 div 的内容。我希望它们在主 div 垂直方向内滚动。它在 Chrome 和 Firefox 上工作正常，但在 Safari 或 chrome 在 iphone 上它看起来完全搞砸了。它是“Warum Obsthof Böhm?”部分？

这里是link：Obsthof-Boehm

主要代码 Div:

#div_block-261-25 {
    width: 40%;
    display: flex;
    margin-right: 80px;
    height: 500px;
    flex-direction: column;
    text-align: left;
    float: right;
    height: 500px;
    width: 40%;
    padding: 10px;
}

内容代码DIV

#div_block-618-25 {
    flex-direction: column;
    display: flex;
    text-align: left;
    align-items: flex-start;
    height: 400px;
    overflow: auto;
}

Answer 1

首先，你在#div_block-261-25中有2次height: 500px; width: 40%;。

然后只需将 flex 添加到您的 div:

#div_block-618-25 > div{
  flex: 0 0 auto;
}

它应该可以解决您的问题。（在 safari 上工作）

CSS overflow:auto 搞砸了 ios 和 safari

CSS overflow:auto screwed up on ios and safari

css

overflow