オーバーフローがサファリで動作しない

Question

私は多くのブラウザ、Firefox、Safari、IE10、Androidデバイスなどでうまく動作しました。しかし、iPads、iPhoneなどのiOSデバイスに変わると、オーバーフローが働いていません。

.card.with-scroll .card-body { 
    height: calc(100% - 44px); 
    overflow-y: auto; 
    -webkit-box-flex: 0; 
    -ms-flex: 0 1 auto; 
    flex: 0 1 auto; 
} 

Answer 1

オーバーフロー：自動;オーバーフロー：スクロール; iOSとOS Xでは動作が異なるようです。 オーバーフローを使用してみてください：scroll;プラス-webkit-overflow-scrolling：touch; iOSとOS Xの場合

Answer 2

サファリで動作させるためにプロパティの前に-wekit-を追加するだけです。

.card.with-scroll .card-body { 
    height: calc(100% - 44px); 
    -webkit-overflow-y: auto; /* added css prefix for safari */ 
    -webkit-box-flex: 0; 
    -ms-flex: 0 1 auto; 
    flex: 0 1 auto; 
}