Joomla Templates Club 406,261 posts

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#527303

Hi Morten,

You can try to use other CSS compress tools, for instance JCH Optimize, jFinalizer, ScrpitMerge… They can be found here.

I you want manual compress, consider tool like csscompressor.com which allows to compress the code and leaves it to you to copy into your document.

Alternatively, you can use 3rd party services like CloudFlare.

[mortenrasmussen Friend mortenrasmussenJoin date: October 2010Posts: 78Downloads:0Uploads:19 Thanks: 11 Thanked: 5 times in 1 posts]

#528065

Now I finaly had a chance to test it on a “real” IE9″ PC.

The issue is stille there, but I have narrowed it down a bit. The issue is dependent on conflicts to at least three modules. Pages that do not have these modules work fine (and have probably done all the time).

These are:

– JReviews module,
– Social ads module
– JGive module

When disabling these three modules it works fine on alle pages.

The thing I do not understand is, why this is ONLY when on IE9? The problem is not on IE10 and IE11 nor any other browser.

This is the real issue here. Do you know how to fix this?

Thanks and kind regards, Morten

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#528705

The issue on IE9 was because of the number of css files on your site (up to 40 files), meanwhile Internet Explorer supports a maximum limit of 32 individual stylesheets only.

Please have a look at this article for more information: http://support.microsoft.com/kb/262161

As can be seen from article above, IE faces some limits below:

– All style tags after the first 31 style tags are not applied.
– All style rules after the first 4,095 rules are not applied.
– On pages that uses the @import rule to continously import external style sheets that import other style sheets, style sheets that are more than three levels deep are ignored.

Hope it helps.

[mortenrasmussen Friend mortenrasmussenJoin date: October 2010Posts: 78Downloads:0Uploads:19 Thanks: 11 Thanked: 5 times in 1 posts]

#528942

Thanks for the info.

It is just strange that I only face this IE9 issue with my JA template, not with my YOO templates and my Shape5 templates (testing the same site of course).

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#529145

I helped have general and responsive css files merged, please download my attached files and follow these steps:

+ Download and extract my attached files
+ Copy the ja_wall_general.css and ja_wall_responsive.css files and paste into the templates/ja_wall/css folder
+ Open the templates/ja_wall/index.php file

Change


<!-- TEMPLATE STYLESHEETS -->
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/reset.css" media="all" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/layout.css" media="all" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/core.css" media="all" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/navigation.css" media="all" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/joomla.css" media="all" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/modules.css" media="all" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/template.css" media="all" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/k2.css" media="all" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/print.css" media="print" />
<!-- //TEMPLATE STYLESHEETS -->

<!-- MEDIA QUERIES -->
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/layout-mobile.css" media="only screen and (max-width:719px)" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/layout-mobile-portrait.css" media="only screen and (max-width:479px)" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/layout-tablet.css" media="only screen and (min-width:720px) and (max-width: 985px)" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/layout-normal.css" media="only screen and (min-width:986px) and (max-width: 1235px)" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/layout-wide.css" media="only screen and (min-width:1236px) and (max-width: 1585px)" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/layout-wide-extra.css" media="only screen and (min-width:1586px) and (max-width: 1890px)" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/layout-hd.css" media="only screen and (min-width:1891px)" />
<!-- //MEDIA QUERIES -->


To

<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/ja_wall_general.css" />
<link rel="stylesheet" type="text/css" href="<?php echo $tplcsspath ?>/ja_wall_responsive.css" />

Let me know if it helps.

---

Attachments:

1. css_custom.zip

2 users say Thank You to Ninja Lead for this useful post

1. mortenrasmussen
2. doparedes07

[mortenrasmussen Friend mortenrasmussenJoin date: October 2010Posts: 78Downloads:0Uploads:19 Thanks: 11 Thanked: 5 times in 1 posts]

#529345

It actually seams to work. I have tested in IE11, FF, Chrome and it looks good. And in IE9 it also seams to work without issues. So at this point it’s all arms in the air 😀

At first I changed ALL the code that you mentioned with the new two lines. That broke the responsiveness. Until I realized that it was only the code in the stylesheet section and NOT the code in the MEDIA QUERIES. After keeping the MEDIA QUERIES it worked.

I will test some more and get back if I observe any issues again.

For now, thanks a million times!!!

Best regards, Morten

[Author]

Posts