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.
Related
So I was testing out the 960gs when I encountered a problem with the Opera & IE8 browser.
Below is an image with the page rendered in Opera (But same error happens in IE8.)
I don't care about the buttons not being styled correctly, but it's the divs aligning horizontally that bugs me.
Below is the same page rendered with chrome (looks the same in firefox).
Anyone knows what the problem might be?
Your HTML has incorrect tags. buttons cannot have hrefs. Only links (a tags) can.
Your CSS does not have gradients for Opera, IE only for Safari/Chrome.You would do that using -o-linear-gradient(top, #ade2ff, #0588fa);
Well, either you use <button> or <a>. If you start your buttons with <button> you can't end them with <a>. Just choose one of them and your grid layout works.
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).
I have noticed this weird behavior in firefox, it seems like font have some colorful noise. The example is shown in the image.
Does anyone know how this can be solved? With some CSS media type (which now is screen)?
I'm using firefox 4.0.1.
Any help is appreciated.
You're seeing subpixel font positioning and rendering. I assume that you're on Windows, which is why you only see it with Firefox 4 (and IE9, if you try that). On Mac, Firefox has done this for a very long time.
I have an image that is not loading in IE8. When browsing to the image it comes up. It loads in Firefox and Chrome.
I have tried running IE8 in safe mode and compatibility mode.
On some boxes with the same OS and browser it displays. Any other suggestions?
Thanks
Cant see your code but I've had this problem before.
Im guessing you've got
<img src="pathtoimage/photo.jpg">
Try
<img src="/pathtoimage/photo.jpg" />
or try substituting in an absolute url and see if it makes a difference
<img src="http://mysite/pathtoimage/myphoto.jpg">
What do you see? A red-X? I have seen this happen with some .jpg's with funky color settings. I apologize for not knowing the exact specifics, but I sent it back to our graphics folks who know immediately what to do. "Oh, sorry - wrong blahblah. Try this one." and it works. CMYK vs. RGB maybe?
I think the problem is with the AlphaImageLoader IE hack to get transparency. Our image is a gif with the css AlphaImageLoader style applied.
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?...