Support Article
Incorrect display for flexbox layouts (IE browser)
SA-43405
Summary
Internet Explorer 11 browser does not display Flexbox layout sections correctly.
Sections are rendered with horizontal overflow that goes behind other sections.
However, this displayed correctly in Chrome browser.
Error Messages
Not applicable
Steps to Reproduce
Configure Dynamic layout with Flexbox mode.
Root Cause
Flex layout in Internet Explorer 11 is supported however, there are limitation with respect to Internet Explorer browser wherein it does only partial support for Flex containers.
Refer Caniuse website on Flexbox's support for Internet Explorer and Chrome browsers.
Resolution
Perform the following local-change:
Use Inline layout instead of Flexbox
(Or)
Use the below code snippet in the UserWorkForm.
<style>
.flex.layout-content-default {
display:block !important;
}
</style>
<script>
$().ready(function(){
$(".harnessContent").find(".flex").removeClass("flex");
});
</script>
Published January 3, 2018 - Updated October 8, 2020
Have a question? Get answers now.
Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.