I just developed a small website and tested it locally in IE8, there is no compatibility view button but under settings i find an option called "display intranet sites in compatibility view", this option is checked so i trust that all local files are rendered as IE7.
I then upload the page to my server and everything works fine in IE8-mode, now the the comp-view button is visible, i click it and my design becomes fubar!
I go to the settings for comp-view and uncheck the "display intranet sites in compatibility view", the site still looks ok when i try to browse it directly from the hdd and there is still no comp-view button visible.
This time i managed to create a fix in my css quite easily but i don't want to experience this again for a larger website.
How can i get BOTH IE8-mode and compatibility view for local pages and can i trust that it is active or not?
If you load files off your C:\ (e.g. that kind of local) then yes, you are forced into IE8 standards mode. In this case, the only way to toggle it is to use the Developer Tools F12 and toggle it there, by doing the following:
Press F12 to access the Developer Tools. A new pane will appear at the bottom of the browser window
On the left menu, scroll down to the final option (Emulation). Or, press Ctl+8
Set the Document Mode to the desired browser version.
If by local you mean off a webserver running on your PC or on a PC in your network (e.g. Intranet) then you can add it/them to the list of sites... they will then provide the icon on the address bar to toggle it.
I presume based on your description that you are seeing significant changes thus I presume you have set a DOCTYPE. Can you verify this for us?
I use this Meta Tag in IE8 to emulate IE7. If there is a Quirksmode Doctype, then this tag will not work.
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
You can Use the *+html CSS hack under IE8.
Instead of checking the "Display intranet sites in compat" try checking the "display ALL sites in compat". Thats what I usually do and it seems to work ok.
Related
I am involved recently in a project to restyle a certain published website. I have no access to the code and the CSS files. what I can to do is to load my custom local CSS as a new "user stylesheet" into firefox or chrome using the extension Web developer toolbar which is available on chrome, opera and firefox.
For a reason, "Web developer toolbar" offer a great feature called [Add User Style Sheet] which enable me to load my local CSS and tweak it using firebug to restyle the page as needed.
but of course some tweaks are necessary to do over IE and there is no tool like "Web developer toolbar" over IE. I know there is a way to load a user style sheet from Internet options > accessibility. but it is very dummy, specially when switching from various IE versions using the built-in IE developer tool. and of course that user style sheet will be active only when restarting IE!! ... so it doesn't make sense doing modification on my CSS and restart to see the affected modification !!
Until the time we decide to eliminate IE forever, I am wondering. if there is a way/tool to load my custom CSS over IE and tweak it from outside IE and just reload it? or by refreshing the page[F5]?
Thank in advance.
It wont be easy or quick but the best solution for you r problem would be to do your css styling with IE code inspector. I know its not as good as Firefox or chrome but you will at least be able to see what works and what doesn't. You can ofcouse copy and paste directly out of IE code inspector into your stylesheet but if you refresh you would have to insert all the new styles again.
From what I understand, IE 8 should display embedded fonts, however my version substitutes generic fonts -- not just for my code, but on other sites, even when the CSS is properly IE-hacked (for example, this sample displays all the IE-hacked properties for me (shadows, etc.), except for the embedded font).
I'm wondering if there is a setting in IE8 that would cause this? I'm on a heavily locked-down work computer (this is why I'm using IE8), so that may have something to do with it, though I'm not sure why this would affect font-face specifically.
Any help would be greatly appreciated!
From http://msdn.microsoft.com/en-us/library/ms533034(v=vs.85).aspx
On the View menu, click Options and then click the Security tab.
Select Custom and click Settings.
Scroll to the Downloads section.
Change the Font Download setting from Disable to Enable.
I have a HTML5 site that when viewed in IE9 on my DEV server it always defaults to IE7 standards and looks broken. Using Developer Tools, I can manually switch the Document mode to IE9 Standards (Page Default), then the page looks good. However, the same page in PROD shows that it defaults to IE9 Standards.
Is it true that whenever the IE browser displays the "Compatibility Icon", does that mean there are CSS or HTML issues? Because the icon only shows up on the PROD version of the website.
I would add the tag x-ua-compatible tag, but it must not be best practices because it doesn't validate by the W3C. Is adding the tag the ONLY way to fix?
There's a checkbox on the Compatibility mode settings that say something like "Use Compatibility modefor intranet sites". Try setting it off on the clients's IEs.
We ended up adding a dynamic check to set the meta tag if we were in the DEV environment and leave the PROD boxes alone, it seems to be working fine. Thanks Lucero and pst for your assistance.
I am looking for a fix for styling a webpage that so that a webpage on google chrome, will look the same as it does on firefox, meaning, is there some syntax in css to make all of the web browsers look the same. does this exist (I would also like one for I.E., and any other web browser if it exists if it exists)
Google Chrome uses a different rendering engine than Internet Explorer/Firefox, so may display web pages differently. Apple Safari uses the same rendering engine as Google Chrome (WebKit) and should display pages the same way.
If your site isn't rendering properly in any browser, make sure your HTML and CSS are valid by testing them at http://validator.w3.org/.
If your site doesn't render properly in Google Chrome or Apple Safari, file a bug at webkit.org as described at http://webkit.org/quality/reporting.html.
If your site renders properly in Apple Safari but not in Google Chrome, please file a bug against Google Chrome at http://code.google.com/p/chromium/issues/list.
How can I test my website in Google Chrome?
There are several tools to help you test your website in Google Chrome:
Web Inspector
Right-click on any component on a web page to launch the web inspector. You'll be able to see the elements and resources associated with the component on which you clicked, including a hierarchy view of the DOM and a JavaScript console.
Task Manager
Select the Page menu icon, then Developer > Task Manager (or press Shift+Esc). The task manager shows all running Google Chrome processes, and the resources that they're using (memory, CPU, and network).
JavaScript Debugger
Select the Page menu icon, then Developer > Debug JavaScript. This launches a JavaScript debugger that can be used to attach to existing processes.
I found the Answer. Being that I am using drupal, there is a built in IE fix for the theme that I am using (fusion) that creates separate css files (ie7.css, ie8.css, etc). using these, I can adjust what I need for IE specifically.
Most layout problems with decent browsers are cause by invalid HTML, invalid CSS, or misunderstanding what a particular piece of CSS is actually supposed to do.
In general, when I see a difference between FF and Chrome, it is because Chrome is doing the proper thing and FF just happens to be rendering some invalid CSS fine. 99% of the time, I can fix the CSS and get FF and Chrome to render the same.
The remaining times, I typically browser sniff and use jQuery to fix the problem.
I am completely confused - I have a website that renders perfectly in IE8 when run through Cassini (in Visual Studio) but has several messed up elements (style/look) when deployed to localhost and viewed through the same browser (IE8).
I have run Beyond Compare 3 on the html and CSS files and they are exactly the same. Are there any circumstances where IIS7 could be somehow sending extra/different information to the browser? Has anyone run across something like this before?
Note that Chrome and Firefox both render the same webpage just fine through Cassini and IIS7.
(Update)
What Browser Mode and Document Mode does IE8 Developer Tools think you are in if you press F12?
When running from Cassini (http://localhost:22120), IE8 stays in IE8 mode (with the option for turning on IE7 compatibility view) and everything looks great.
When running from IIS7 (http://{machine name}), IE8 automatically goes into in IE8 Compat View, IE7 standards and things look horrible.
My assumption (as mentioned in my comment earlier) was that IE is working in a different rendering mode, depending on whether you are using IIS or Cassini, and this is causing the layout differences. It actually appears to be IE that is causing this, based on the settings found in Tools | Compatibility View Settings. There are two check boxes:
Display intranet sites in Compatibility View - this is checked by default.
Display all websites in Compatibility View - this is not.
Either way, you should use the standard meta tag to force the mode you wish to be rendered in.
<meta http-equiv="X-UA-Compatible" content="IE=8" />
Hope this helps.
I think the best solution I have found is not far from Paul's one but it tells the browser to use your Internet Explorer version which solved other problems I have with content="IE=8".
Here it is:
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
Actually I had the same issue. IE8 has a compatability settings dialog under tools menu. There is a check box which indicates "Display intranet sites in compatability mode".
And not that IE7 compatability mode is not the same as using ie7, there are some differences.
One side note to this issue:
if the same page renders differently on different servers but in the same IE8 browser, check your url - IE8 automatically displays in compatibility mode if the domain is not fully qualified.
If the page content is the same then compare the headers that the servers are sending with the page.
After kicking this around a bit I though about compatibility mode. Try manually forcing IE8 to render the page in compatibility mod. If the render doesn't change then you know that the issue is because IE is rendering that page in compatibility mode when reading it from that web server.
If the latter is the case look into http://msdn.microsoft.com/en-us/library/dd567845%28VS.85%29.aspx