1

After upgrade to Winter 21, I found Lightning Design System show weird in IE-11. Please see follow image.

enter image description here

And this is my code.

<apex:page sidebar="false" lightningStylesheets="true" showHeader="false" docType="html-5.0">
    <apex:slds></apex:slds>
    <button class="slds-button">Button</button>
    <button class="slds-button slds-button_neutral">Neutral Button</button>
    <button class="slds-button slds-button_brand">Brand Button</button>
    <button class="slds-button slds-button_outline-brand">Outline Brand Button</button>
    <button class="slds-button slds-button_destructive">Destructive Button</button>
    <button class="slds-button slds-button_text-destructive">Text Destructive Button</button>
    <button class="slds-button slds-button_success">Success Button</button>    
</apex:page>

You can see all SLDS style not work.

I check Winter 21 Release Note and I found "Customize Components with Lightning Design System Styling Hooks (Beta)" update in Lightning Design System. Here is the Link: https://releasenotes.docs.salesforce.com/en-us/winter21/release-notes/rn_slds_styling_hooks.htm

In this document I found follow content:

Styling hooks make it easy to customize component styling and express your brand, especially when working with web components and shadow DOM. For a list of component blueprints that support styling hooks, see the Lightning Design System website.

As far as I know IE-11 not support this feature, please see this link: https://developer.mozilla.org/en-US/docs/Web/CSS/var

And I try open Lightning Design System's Button component page in IE-11, but I got a blank area.

enter image description here

But it's work fine in Chrome.

enter image description here

Since this is a beta function may I ask how to disabled it?

Best wishes, Lee

Improve this question
1
  • 2
    According to help.salesforce.com/…: "If you opt in to Extended Support for IE11, you can continue to use IE11 to access Lightning Experience and Lightning communities until December 31, 2020." So, the advice is to use a different browser/recommend your users to use a different browser as soon as possible. My personal experience is that some Lightning pages already just don't work in IE 11.
    – Sander de Jong
    Oct 14, 2020 at 8:06

1 Answer 1

Reset to default
0

To fixed this issue, we can download old version of SLDS css, and add to VF Page when Browser is IE-11.

Improve this answer

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .