diff options
| author | Mark Otto <markdotto@gmail.com> | 2017-07-01 03:35:02 +0300 |
|---|---|---|
| committer | Mark Otto <markd.otto@gmail.com> | 2017-07-01 21:21:20 +0300 |
| commit | 2d4534e112d7ceca112f7a11f768ed733813cbb1 (patch) | |
| tree | 06f12cf346b43fa34a959e63f18dcbb0d656d135 /scss/_carousel.scss | |
| parent | 7f6479b0d9878dc8fc2de2a6787ec0f6450b46c9 (diff) | |
use @supports to apply transform3d to those who can do it, then provide a non-3d fallback to ie11
Diffstat (limited to 'scss/_carousel.scss')
| -rw-r--r-- | scss/_carousel.scss | 18 |
1 files changed, 15 insertions, 3 deletions
diff --git a/scss/_carousel.scss b/scss/_carousel.scss index 41eca949fb..d0f210df1a 100644 --- a/scss/_carousel.scss +++ b/scss/_carousel.scss @@ -34,17 +34,29 @@ // CSS3 transforms when supported by the browser .carousel-item-next.carousel-item-left, .carousel-item-prev.carousel-item-right { - transform: translate3d(0, 0, 0); + transform: translateX(0); + + @supports (transform-style: preserve-3d) { + transform: translate3d(0, 0, 0); + } } .carousel-item-next, .active.carousel-item-right { - transform: translate3d(100%, 0, 0); + transform: translateX(100%); + + @supports (transform-style: preserve-3d) { + transform: translate3d(100%, 0, 0); + } } .carousel-item-prev, .active.carousel-item-left { - transform: translate3d(-100%, 0, 0); + transform: translateX(-100%); + + @supports (transform-style: preserve-3d) { + transform: translate3d(-100%, 0, 0); + } } |