I created an asp.net application and published it sucessfully on a local webserver.
The problem is, that any page of the application looks different in internet explorer.
I know that the look can be different in different browsers like firefox, ie, chrome...
The funny thing is, that it even looks different in the internet explorer on two different pcs.
When I open it on my laptop, the page looks 'normal' (since i wrote the css on my laptop, so i know how it should normally look), but when i open it on a desktop pc connected to the same lan, it looks very different (some objects are wider or higher). Both IE Versions are the same (9.0.8112.16421).
I really don't know how this is happening.
Begging for some help, please!
Several possibilities
IE is in Compatability mode
IE is zoomed in
The screen resolutions are different
The DPI settings are different
Just figured it out.
The Problem was the Quirks-Mode in IE9. I simply added following code inside my head-Element in the SiteMaster:
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
Because of the Quirks-Mode IE9 pretends to be IE5.5 due to backward compatibility.
This is pretty all you need to do the trick. ;-)
Related
In Chrome and Firefox my site loads perfectly, however in Internet Explorer 11 the CSS is only applying fully after pressing Ctrl+F5 (sometimes several times). Strange thing is that some CSS IS applied. Just some elements are ignored.
Since my CSS is pretty large I don't want to paste it all here but the behavior can be seen live here http://www.telefonievergelijken.nl
Here's how it looks in Internet Explorer 11 on 1st pageload:
And here in FireFox:
On your webpage:
<meta http-equiv="X-UA-Compatible" content="IE=8" />
I believe it is a problem. It tells browser to display page in IE8 compatibility view, so most things is displayed wrongly.
I know there are a lot of other questions regarding the "jagged" or "pixelated" fonts problem, but here's the weird thing, for me at least..
After building a site locally and testing in Firefox, the font loaded from Google Webfonts looked great. Almost Photoshop quality. It was only after I had tested the site in some other browsers, such as IE, Opera, Chrome and Safari, that when I returned to Firefox the font started to appear jagged.
I'm wondering if when I loaded up the other browser, it changed a setting somewhere on my PC. I have a AMD Advent Monza S150 with Windows 7.
I've also messed around with the ClearType option but still no luck. Can anyone shed any light on this?
More of a shot in the dark, than the real answer, but... one reason that could be that the font you are using on your website is installed on your PC. Google webfonts, and webfonts in general usually have the downside of looking good only with certain font sizes.
Does any one know why some of my font families won't render on some mobile devices? Here's a page that demonstrates the fonts:
http://jl.evermight.com/font/
The fonts render properly on desktop chrome browser, ipad and iphone.
But when i view that page on my galaxy note, the Have A Nice Day font renders as something that looks like arial. On my friends nexus 4, Have a nice day works fine, but the universe condense renders as something that looks like arial.
Does anyone know why?
I've attached screenshot of what the fonts should look like
Additional notes
some people claim Have a nice day is not working in Firefox or IE10. For me, the font works on Firefox. I don't have IE10, so unable to verify.
How do I make this font work on my android?
Additional Notes
I had a typing mistake in my link path to my css files. I've corrected it now. But the problem still appears in my droid browser.
Just tried out the link on my phone - HTC 8s, everything seemed to work fine. Below is the screenshot for the same.
ON HTC 8S
ON IE 10
It's possible it's a downloading issue. The fonts listed in your declaration should work across most browsers (just make sure you're not in Opera Mini, it doesn't really support much of anything).
Additionally, Have a Nice Day is loaded through #font-face declarations in the CSS file, but the others appear to be loaded from the JavaScript, which might be part of the issue. Droid Sans is on Android phones by default, so they're likely just pulling them locally, which is why they work across the board on Android. From there, it might be a difference of JavaScript support (if Universe doesn't work, JS isn't turned on, for example).
Another thing that might help is opening up developer tools in a desktop browser that isn't working (in the case of Firefox, you'll want to pick up the Firebug extension). Check the "Net" or "Network" tab and see if your font files are getting downloaded.
If that still doesn't work, try playing around with the order of the font files in the declaration. I've seen browsers take issue with the order.
Also, the Droid Serif fonts are available from Google Web Fonts, which works cross browser with little headache. It might be worth seeing if your other fonts (or something close) are there, too, and just use Google's Web Font Loader to load your fonts.
The problem has been fixed. Apparently there was a bug on myfonts.com that corrupted my font files. I contacted myfonts.com and they corrected the issue right away. Then re-sent me the font files. Now everything works perfectly.
The guys at myfonts.com are amazing. Very good customer + tech support services.
Below is a link to how I do my #fontfaces for cross browser compatibility.
Cross Browser Fontface
I have a couple of web pages with css'. When I open the index page in chrome and firefox, there is no error. However when I open in internet explorer, one division will be invisible.
Although I see that division in source code, when I open it by the developer tools in ie, I can not see it there. What can be the error?
Does your web page have a DTD ? Do you still have the problem if your DTD is XHTML strict ?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
IE is well known to be wildly off the standards for compatibility reasons to support pages written in the mesozoic era of IE4 and IE5 when MS thought they would rule the web over the W3C. To make sure IE is more respectful of the standards, use this DTD and there should be little cross browser issues between MSHTML, Gecko and Webkit browsers.
Every browser receives a copy of the whole client-side source code. Sadly, Internet Explorer (IE) is lagging behind when it comes to implementing standard functionalities. For this reason, IE will not always interpret your code correctly. In fact, it will interpret the code in the way it believes it is right and not the right standard way of doing it.
For a long time, Microsoft has thought that it could be above the web standards because it has the monopoly of the market shares. This is slowly changing though. Perhaps, the expected standard compliant features of IE9 reflects the market shares loss for Microsoft in the browser wars.
Still, a great majority of users are not aware or care about browser functionality. They are more likely to not upgrade to IE9 when it comes out. Therefore, I suggest that you add the following markup in your HTML document header:
<meta http-equiv="X-UA-Compatible" content="chrome=1">
You can find more info about this here. Thank you Google!!
It would be interesting to see the faulty source code...
I need to fix a ASP.NET website that works in IE6, to work in IE8 browser. I added the EmulateIE7 http header to IIS6 as short term fix, but still the pages are not displayed correctly. the web app was initially designed and developed for IE6, now we are upgrading to IE8, so is there any quick fix available for IE6 website to display correctly in IE8? I thought the EmulateIE7 works for both IE7 and previous versions as well, is that not correct?
regards,
Rama
I can't remember exactly what level of CSS IE6 uses. You could maybe try telling IE8 to render the page as IE5 did by using the following META tag in each page:
<meta http-equiv="X-UA-Compatible" content="IE=IE5" />
If this is site wide, then add it as an HTTP header in the web server itself.