Safariでのみposition: stickyが効かない！？

自分用のCSS格闘のメモ。
iOSとMacのSafariだけでposition: stickyが動かない。ChromeやFirefoxでは問題なく上部に固定される。

原因

固定したい要素のdisplayプロパティがdisplay: inline、display:inline-block、display: inline-flexなどインラインな値だと効かないらしい。<span>タグ、<a>タグあたりはデフォルトでインラインだからそのままだと効かない。

display: blockかdisplay: flexにしたら固定されるようになった。