Site does not display correctly in...

User 2526084 Photo


Registered User
65 posts

Loaded my site up in IE 11, normally always use chrome, I noticed that it was not displaying correctly.

IE 11 image :(

https://www.onsafelines.com/img/ie.png

as opposed to Chrome image :)

https://www.onsafelines.com/img/chrome.png

Guess first question is, is it just my PC, and if not, any suggestions on a fix...
User 379556 Photo


Registered User
1,533 posts

I think it would be difficult to know the answer without seeing the SD V3 project (.rsd) file.

If everything was set up with Design for Display Grid (in the Apply Styles section of the Styles panel), it would be necessary to switch to Design for Fallback first and make adjustments to get things showing correctly for IE 11 as well.

Frank
User 283347 Photo


Registered User
388 posts

It looks on my IE 11 just as it does on yours (which I have to manually find on my computer as I do not use it). Do you use analytics? How many folks are visiting with IE? If not many ( I have a site with zero visits from IE) I wouldn't worry about it unless the fix is easy.

MJ
User 2073960 Photo


Registered User
28 posts

Had a source code from link in your sig. My guess is IE11 might have problem with the flexbox use there for some reason. I'm not sure those texts need flex so you could try using just standard blocks more. Or maybe put the link and description texts in a div to group them for any flex container.
User 2526084 Photo


Registered User
65 posts

Stats from Analytics.
https://www.onsafelines.com/img/browers.png

Looks like I have something to worry about, and a site review to undertake...

Will look at all the suggested fixes so far, and if anybody else has any other tweaks I might try, that would be great.

Back to the drawing broad...
User 2699991 Photo


Registered User
4,782 posts
Online Now

Rooky wrote:
Stats from Analytics.
https://www.onsafelines.com/img/browers.png

Looks like I have something to worry about, and a site review to undertake...

Will look at all the suggested fixes so far, and if anybody else has any other tweaks I might try, that would be great.

Back to the drawing broad...


Use fallbasck first with the old fashioned way, Blocks Inline Blocks Inline etc etc. (that is what IE will use

Then change to " Display Flex" and use flexbox, Thats what chrome and others can see.
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 2699991 Photo


Registered User
4,782 posts
Online Now

Sorry Frank didn't see your post suggesting same thing
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 244626 Photo


Registered User
811 posts

You may try changing the div with the container-icon bundle classes (your pictures above the text) from flex to block.
Bootstrap 5 CSS Grid.
User 2526084 Photo


Registered User
65 posts

I played around with all the suggestions offered, and to a large degree I just seem to make things worse... Then, as if by magic it all come good, have no idea which fix worked or whether it was a combination of several... :D

My testing from the design PC shows;

IE 11
https://www.onsafelines.com/img/browser_ie.png

Chorme
https://www.onsafelines.com/img/browser_chrome.png

Edge
https://www.onsafelines.com/img/browser_edge.png

Fox
https://www.onsafelines.com/img/browser_fox.png

Did not test Safari as apple have stopped support for the windows version, apparently leaving it with known security leaks...

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.