I am using compass to make image sprites. It successfully works on modern browser but its not working in ie 8 and ie7. I am really new to compass I just used some simple mixin to display the sprite.
#include spr-sprite("arrow-step"); height:30px; width:30px;
Is there anything am missing with it. Thanks in advance for the repliers.
Oh god. I was using sprite under the selectors like h1:not(#foo) which is not supported in ie 8 and ie 7. Its solved.
Related
Hi, I am using the Highcharts library for drawing charts, however I came across an issue with the yAxis in Internet Explorer.
How can be yAxis text displayed correctly rotated in IE8 and IE7 ?
I have the same problem and I figured out that this problem is caused by ie8 emulator. So if you use a native ie8(ie8 from windows xp), will work without problem. On highcharts code there is an method to create css properties, and on this, highcharts create the property for each browser. if ie -ms-transform, if mozilla moz-transform, if web-kit ...
But for browser earlier than ie9 css3 rotate is not supported, so there is a matrix rotate, and this guy(progid:DXImageTransform.Microsoft.Matrix), dont works on ie8- emulator.
Try to run your code on winxp native ie8 and will work.
;D
Based on you're description of the issue, I believe this will help. Note the only workaround is to apply a background color to the label.
https://github.com/highslide-software/highcharts.com/issues/663
am practicing on web design, so am working on this template
i cant get the transition animation to work in chrome but instead its working fine in FF
am using transition ease-in-out, anyone can help me?
Make sure you add the -webkit- prefix to the transition property.
I have been trying to play a bit with the CSS3 and build a Netscape logo purely out of CSS3 for training.
Here is the link:
http://alonbt.com/css3/netscape/
The thing is: In Firefox all looks well, but in Chrome something goes wrong. I assume this is the overflow:hidden I have - in Firefox it works but Chrome doesn't seem to render it well.
Any suggestions bout what might be the problem?
I've detailed this issue here: http://tech.bluesmoon.info/2011/04/overflowhidden-border-radius-and.html
In particular, you're being hit by https://bugs.webkit.org/show_bug.cgi?id=50072
The issue shows up in Safari too.
You can workaround this problem if you don't use relative positioning. Try getting rid of the 'position: absolute' CSS property and use negative margins instead (e.g. in your case, something like: 'margin: -204px 0 0 -475px;').
Pay attention however that you'll have to compensate somehow on item ordering (you no longer have control over z-index but you need it).
I had the same problem in Chrome on a Windows computer, a img in a div, with overflow:hidden on the div. On a Mac everything showed fine, but Windows Chrome ignored the overflow:hidden. My solution: -webkit-transform:scale(1); on the img (the child).
They look great in FF, Safari, but the social media icons don't render correctly in IE.
http://www.erisdesigns.net/STAGE/ED1.3/
Is this an IE problem, or something to do with how I'm creating the .pngs?
There's a pngfix javascript add-on you can trigger with an IE conditional statement.
PngFix
<!--[if lt IE 7.]>
I think that it's because you use transparency. Although it isn't as clean as the current solution, you should maybe make everything opaque.
Trying to get Raphael JS to work with IE8.
I am using the text() function to draw some text, which works perfectly in FF3 and Chrome, but not in IE8 (neither compat nor regular IE8).
Other drawing stuff works well in IE8, so I'd guess I am missing some stupid minor detail on how to render text in Raphael.
Oh and this is their latest 0.8.6 version of the library.
Any ideas much appreciated.
Got It!
Can not set font size in em in IE, for some reason. Setting font-size in "px" works perfectly well. Who could have known?...