要素の影響範囲を制限し、ブラウザの最適化を助けるプロパティです。layout、paint、size、styleなどの値で、要素が外部に与える影響を制限します。大規模なアプリケーションのパフォーマンス改善に有効です。
contain: none | strict | content | size | layout | style | paint.widget {
contain: layout style paint;
}ウィジェットの影響を局所化
.card {
contain: layout;
}レイアウトの影響を制限
大量の要素がある場合のパフォーマンス向上に効果的。
Chrome 52+, Firefox 69+（部分対応）