CSS Styling Issue

I have 12 sites using a simple styling script for my blog and other images throughout my sites.
It saves me allot of time so I prefer to keep using it.

The script is working fine on 10 sites, but the 2 using your template will not
show the styling in Internet Explorer. I am using IE9 and have had others look as well.

Here is an example: Try this in Chrome or FF then IE
http://www.life-xt.com/services/symptoms-of-low-t

Now try this link. Different Template and works fine.
http://beachbodymd.com/our-services/medispa

The script is called Complete Image Styles
http://joomla.impression-estudio.gr/com ... s/demo.php

The person who built the script said the following:
"I checked your websites and I saw that this problem is occurred only in IE and in your website (as you also said) because I applied exactly the same settings in my local website and I could see the styles normally. I tried to find what is the problem by debugging Javascript, I disabled some modules/plugins, I changed some settings in the template parameters but no luck.

I really don’t know what else to try but I think it has to do with Javascript.
If you know any plugin or module with special behavior for IE, disable it temporary and see if the styles work."

Any help would be appreciated with this.

All access to my site is in ticket XGU-229-93491

Hi

Can You please tell me what exacly this plugin should be doing ? Because from what I see it can be replaced with a couple of lines of css code with a benefit to site's performance.

Hi

Can You please tell me what exacly this plugin should be doing ? Because from what I see it can be replaced with a couple of lines of css code with a benefit to site's performance.

Hi, Sorry for the late reply. For some reason I didn't get an email update to my post.

The plugin just adds some CSS formatting Style. So I can just select the style I want form JCE Style dropdown, and this is added to the image.

I like it because it makes things simple for me, without having to cut and past code for each new article.

Here is a link to one of their demos. http://joomla.impression-estudio.gr/dem ... les/demo-1

Here is a link to one of my sites where it is working properly. http://www.beachbodymd.com/blog

Something in your template code is overwriting the output of this plugin.
I am using this on several other templates from other companies with no issues.

Hi

I've looked everywhere, but there is no good developer tool for IE to truck it. Please try one thing: delete all ie6 - ie9 .css files from template's /css folder and let me know if this helped. If You will see any change than You can put this files back and let me know.

Thank you for your help.

I deleted all the IE CSS files and cleaned the cache.
Tried 3 computers with IE and clean cache.

No change. Still no styling in IE.

Hi

Ok. Please send me FTP access. I will need to try couple of things.

Hi

Ok. Please send me FTP access. I will need to try couple of things.

I did in my first post.
Please refer to ticket XGU-229-93491

Hi

Right I took joomla panel access from this ticket already. Forgot there were FTP access too.

I've found the issue in CSS. Not really an issue, but was preventing this particular plugin from aadding shadows. This little code added to override.css solved it:

Code: Select all

#gkMainBlock, #gkLeftMiddle, #gkRightMiddle {
    border-collapse: separate;
}


Hi

Right I took joomla panel access from this ticket already. Forgot there were FTP access too.

I've found the issue in CSS. Not really an issue, but was preventing this particular plugin from aadding shadows. This little code added to override.css solved it:

Code: Select all

#gkMainBlock, #gkLeftMiddle, #gkRightMiddle {
    border-collapse: separate;
}


For some reason this code worked on Life-XT but is not working on MyHRT.com
I added the FTP and changed the FTP user to that domain, if you could please check that for me.

Same template, Same User, Same Password Just change the domain ;^)

Hi

Just one question. Have You enabled to use override in template settings ?

Hi

Just one question. Have You enabled to use override in template settings ?

Thanks, that fixed it.

Hi

Not exacly. I've just found a place where image is outside the area of this fix. So I think more accurate would be to remove collapsing for all areas with a code like this:

Code: Select all

#gkTop1, #gkTop2, #gkUser1, #gkUser2, #gkMainBlock, #gkLeftMiddle, #gkRightMiddle, #gkHeader {
    border-collapse: separate;
}


Hi

Not exacly. I've just found a place where image is outside the area of this fix. So I think more accurate would be to remove collapsing for all areas with a code like this:

Code: Select all

#gkTop1, #gkTop2, #gkUser1, #gkUser2, #gkMainBlock, #gkLeftMiddle, #gkRightMiddle, #gkHeader {
    border-collapse: separate;
}


You are much too smart for me. I have no idea what you just said LOL ;^))
Is there something else I need to do?

Hi

Basicaly template is using a border collapse, which means that any element is being ended with elements edges. A shadow placed under the image by Your plugin should be drawn outside of the element. It's not a problem for most browsers, but unfortunately IE interprets this two rules together as an error.

My code is changing the way of border display for each template layers.