Public Forums 71,145 posts

[mbajkowski Friend mbajkowskiJoin date: January 2007Posts: 6Downloads:0Uploads:2]

#185080

I see the following problem with t3v3 in ie8. Suppose you have an image that is of size 1024×768. You then insert this image into the article and size it smaller, say 256×192. This new size seem to be respected by most browsers: firefox, chrome, etc. However, in ie8, the image is displayed at the original large resolution – which obviously makes the article layout rather unattractive. The problem seems to be caused by the template.min.css, particularly the img tag: width : auto. Removing this line seems to fix the problem, but would it break anything else in the template?

Thanks,

Maciej

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#483977

Hi Maciej,

With issue in IE browser only, we typically use IE condition comments to fix. You can try with

– opening file: templatesyour_default_templatetplsblocksheader.php

– adding this line:

<!-->
<link href="<?php echo T3V3_TEMPLATE_URL ?>/css/custom1.css" rel="stylesheet" />
<!-->

– custom1.css file will contain your css change applied in IE8 only

Hope this helps.

[mbajkowski Friend mbajkowskiJoin date: January 2007Posts: 6Downloads:0Uploads:2]

#484222

After doing some more research I don’t think your suggestion will work. The problem, it seems, comes from the bootstrap.css, particularly the following line in under the img tag: width: auto9; This IE hack, from what I understand is to get IE8 it properly resize a flexible images. All other browsers will ignore this line. The unintended consequence of this has is that when IE sees this line, it supersede the width declaration in the img tag, and thus displays the image at maximum size which fits the container. I can force the images to be a desired width by using inline css width styling instead of the img width attribute.

Thanks,

Maciej

[arronlee Friend arronleeJoin date: January 2014Posts: 2Downloads:0Uploads:0 Thanked: 2 times in 2 posts]

#520151

Hi, Maciej .
I wonder whether it can be accomplished by creating a web image viewer with the help of some manual tools which can be customized by users according to our own favors and installing an image resizer to it? I am testing about the related projects these days. But I am almost still a green hand on this field. Do you have any ideas about it? Or any good suggestion? Thanks in advance.

Best regards,
Arron

[arbindbhagat Friend arbindbhagatJoin date: January 2014Posts: 1Downloads:0Uploads:0]

#520517

Hi Saguaros,

I urgently need to add a IE8 specific stylesheet. I used your code in the template, and the code also shows in the source code. However, the css codes in that stylesheet has no effect in IE 8. Please advise. I need it urgently.

Thanks much in advance.

Kind Regards,
Arbind

[Wall Crasher Developer Wall CrasherJoin date: December 2011Posts: 1113Downloads:0Uploads:15 Thanks: 66 Thanked: 361 times in 300 posts]

#520615

Hi Arbind,

Please provide some information about your site for us to check.

IE8 has issue with CSS limit. You should compile LESS to CSS and turn off Development Mode when you want to check your site in IE8.

The code Saguaros provided should help to include a css declaration that tweaks for IE8 only.
You can try to add some simple css rule to check at your end.

If you still see the issue, please pm your admin/ftp credentials, I will help to check further.

[arcascomputing Friend arcascomputingJoin date: June 2013Posts: 14Downloads:6Uploads:0 Thanked: 2 times in 1 posts]

#566761

I recently experienced a similar issue and managed to get it working by creating the IE-specific stylesheet as mentioned above, however I added it to the head.php template block not header.php as mentioned above. I added the stylesheet for IE and below using the following lines:

<!-->
<link rel="stylesheet" href="<?php echo T3_TEMPLATE_URL; ?>/css/themes/ebk/ie-fixes.css" type="text/css">
<!-->

(Please note that I’ve placed my stylesheet into the relevant theme folder “ebk” so you may need to adjust that URL on your own site.)

I then added in some necessary fixes but the main one was this one:

.article-content img {width:auto;}

1 user says Thank You to arcascomputing for this useful post

1. Saguaros

[Author]

Posts