diff --git a/opentech/static_src/src/app/src/components/DetailView/style.scss b/opentech/static_src/src/app/src/components/DetailView/style.scss index 0e19c76f3f0d357f87e2df0f003b1ca0d043d576..84936ce2772efa662831b8cb0f399e7648bad6c2 100644 --- a/opentech/static_src/src/app/src/components/DetailView/style.scss +++ b/opentech/static_src/src/app/src/components/DetailView/style.scss @@ -16,4 +16,8 @@ margin-right: -50vw; grid-template-columns: 390px 1fr; } + + @include target-ie11 { + display: flex; + } } diff --git a/opentech/static_src/src/app/src/components/DisplayPanel/style.scss b/opentech/static_src/src/app/src/components/DisplayPanel/style.scss index 8763c4446a7bcdba447f87f221683b5d523ccb04..00e22068d32b078b04289db1b407af6e54dd20ce 100644 --- a/opentech/static_src/src/app/src/components/DisplayPanel/style.scss +++ b/opentech/static_src/src/app/src/components/DisplayPanel/style.scss @@ -11,5 +11,9 @@ @include media-query(desktop) { grid-template-columns: 1fr 390px; + @include target-ie11 { + display: flex; + flex-wrap: wrap; + } } } diff --git a/opentech/static_src/src/app/src/components/Listing/style.scss b/opentech/static_src/src/app/src/components/Listing/style.scss index 30c929f4174cfac8a41432078684537d7d4c829b..ccce2933845262168962d3a86c8a17d1b5c64add 100644 --- a/opentech/static_src/src/app/src/components/Listing/style.scss +++ b/opentech/static_src/src/app/src/components/Listing/style.scss @@ -1,6 +1,10 @@ $listing-header-height: 75px; .listing { + @include target-ie11 { + max-width: 390px; + } + &__header { @include submission-list-item; height: $listing-header-height; diff --git a/opentech/static_src/src/sass/apply/abstracts/_mixins.scss b/opentech/static_src/src/sass/apply/abstracts/_mixins.scss index f9a25c0487340745e734abe5ad5be486a606397f..716d6a984c01d071af403f859503d0c5d1cd89a9 100644 --- a/opentech/static_src/src/sass/apply/abstracts/_mixins.scss +++ b/opentech/static_src/src/sass/apply/abstracts/_mixins.scss @@ -159,3 +159,9 @@ border-bottom: 2px solid $color--light-mid-grey; border-right: 2px solid $color--light-mid-grey; } + +@mixin target-ie11 { + @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { + @content; + } +}