Flex columns not working on IE

Hi,
I have tested my Pro site in IE and the content of the footer columns is not wrapping - it runs wide across the screen beyond the boxes. I believe it has to do with flex css. Your advice will be much appreciated.

Thanks and kind regards.

Brenden

Related CSS:

.fm11.x-bar-container {
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-align-items: flex-start;
align-items: flex-start;
-webkit-flex: 1 1 360px;
flex: 1 1 360px;
max-width: 425px;
padding: 1.75em;
background-color: #505f2c;
box-shadow: 0em 0.35em 2em 0em rgba(0,0,0,0.15);
}

.fm2.x-bar-container, .fm7.x-bar-container, .fm11.x-bar-container, .fm14.x-bar-container {
-webkit-flex-direction: column;
flex-direction: column;
}

.x-bar-container {
display: -webkit-flex;
display: flex;
position: relative;
z-index: 1;
}

Hi there,

Thanks for writing in.

The CSS seems to be correct but I can’t verify it with your setup, would you mind providing your site’s URL that has this issue? Maybe it’s just related flex-shrink and I need to check how it’s currently displayed on IE.

Thanks!

Hi Rad, I have added a secure note above. Thanks and kind regards.

Hi Brenden,

I can see the issue. Please inspect those text element with content. Set max-width value for the element:

Hope this helps.

Thank you Lely, much appreciated.

You’re welcome :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.