Page 1 of 1

Columns not showing in Magazine template with IE

Posted: 12 Jun 2013, 03:54
by gw_peter
I am installing a company internal information site based on WP 3.51 and Suffusion 4.4.6 theme.

Created 2 categories: Headline and Excerpts

Set it up with the excellent magazine template and posted 5 post. 2 post in the Headline category and 3 in the Excerpts category.
In Firefox the pages are shown as it should with Excerpts in columns BUT in Internet Explorer only one column are shown. See attachment.

I have another site where both WP and Suffusion have been upgraded over the last 3 years and this site does not have the mentioned problem. It renders correct with excerpts in columns as it is supposed to do.

I have no idea of what is wrong here. I really hope someone can come up with an explanation and a solution

Re: Columns not showing in Magazine template with IE

Posted: 05 Jul 2013, 03:49
by astra
I have the same problem on my magazine front page, only on IE 10. I know it worked in IE8 or IE9 (forgot which one). It didn't at first, and I fixed some widths and got it going. Some posts even have their sidebars go down to the left like in your example.

On IE 10, and I cannot see any compatibility button !

Microsoft updates automatically, so many viewers must have the latest IE too. And it really is bad, all the rest show properly (Chrome, Safari, Firefox, computer or iphone/ipad)

What's best to do ? I don't know, I can't afford the time to keep fixing Explorer issues (unless someone here does), I guess I'll look for a plugin that checks if it's IE, and ask viewers to use Chrome, Firefox, Safari for a better experience ...

Re: Columns not showing in Magazine template with IE

Posted: 05 Jul 2013, 07:11
by Colin
URL required - Forum rule #6

Probably a CSS tweak will sort it.

Re: Columns not showing in Magazine template with IE

Posted: 05 Jul 2013, 07:30
by astra
Ouch, sorry, here it is, our smaller installation, same problem as the bigger one ...

Problem only in IE10 ... same as gw_peter's problem, supposed to be 3 columns, now just 1 ...

http://www.lyrics-soundart.com/lyrics-news/latest-news/

Re: Columns not showing in Magazine template with IE

Posted: 05 Jul 2013, 08:30
by Colin
I don't have IE10 but give this a try

In Suffusion Options > Back End > Custom Includes > Custom Styles put

Code: Select all

.suf-tile-3c {
  width: 31%;
}
This potential fix is specific for the url that you sent above.

Re: Columns not showing in Magazine template with IE

Posted: 05 Jul 2013, 12:42
by astra
Thanks, Colin ...

Unfortunately, it doesn't work ... even 20% doesn't work, it just makes the columns narrower , but the columns are still all aligned as 1 column instead of 3 per row ...

Re: Columns not showing in Magazine template with IE

Posted: 07 Jul 2013, 03:43
by astra
After being frustrated with Firebug Lite, I finally found out how to invoke the IE Developer tool. From here, by default it shows Document Mode as IE7 standards.

This screws up everything. Changing the Document Mode to IE9 in IE Developer tool fixes everything. I can't ask our viewers to do this of course, they are not internet savvy. So now trying to figure out how to get it done ...

Re: Columns not showing in Magazine template with IE

Posted: 07 Jul 2013, 07:50
by astra
Ok, found out how to fix it ...

Under SEO / Meta settings of Suffusion, we have the option "Force IE7 Compatibility View". I have this set to "Force Compatibility Mode", ever since the option was there.

This calls the php program suffusion/functions/actions.php, and this program has the following line :

echo "\t<meta http-equiv=\"X-UA-Compatible\" content=\"IE=EmulateIE7\" />\n";

I changed it to :

echo "\t<meta http-equiv=\"X-UA-Compatible\" content=\"IE=EmulateIE7; IE=EmulateIE9\" />\n";


What this does is add to the meta instructions to include IE9

Then clear w3tc page cache or other caches if any, clear IE browser cache too, close IE 10. Open IE10, go to problem page, refresh, voila, all ok ...

Re: Columns not showing in Magazine template with IE

Posted: 07 Jul 2013, 11:50
by drake
Nice solution. Just not safe in case of upgrades - actions.php isn't a pluggable file, can't be copied in a child theme, so will be overwritten at each upgrade.

Just curious. What's happens if you let the original file and just disable the option to force compatibility mode for IE?
I never use that option, because in compatibility mode all sites looks odd... so, I don't see a reason for forcing something wrong...
And on my site, my homepage settled to magazine template looks fine in IE10 , without changing anything in theme files. Only when I change to compatibility mode, I get all boxes in one column.

Re: Columns not showing in Magazine template with IE

Posted: 07 Jul 2013, 12:50
by astra
I know, drake, but I have modified some plugins, and some files in suffusion, so I am used to it. I keep a record of all files modified of course. Not a problem. I have even modified magazine.php so I can have some pagination and other stuff. My biggest work is Smushing all the Suffusion theme images every time there is an upgrade. Helps speed it up a bit.

Your website has one column only in my IE10, drake. My IE10 and probably others somehow have the Document Mode set to IE7 Standard. Yours probably has something else (Press F12 to see)

If I remove Force Compatibility mode, it still shows as 1 column in IE10. On my other computer with IE9, it's ok to remove. IE10 not only affects the columns, it even affects sprites layout. And there is nothing wrong with sprites and how they are arranged, very standard html. This is in both Wordpress and non-Wordpress installation. IE10 is changing a lot, many others have some unique problem with it (that's how I found the solution for this) ... All other browsers are good.

Image