Background and page tabs disappear in IE8 - html

My blog works fine in IE10 and in Chrome, but when viewed in IE8, it initially loads correctly but then the background and page tabs and names disappear. It's weird because my test blog works fine and I'm not sure what I changed that would effect it.
test blog - damianp1.blogspot.co.uk
real blog with problem - sthelensbirds.blogspot.co.uk
I'm not even sure where to look to try and find the problem. I'm thinking of going through the code line by line to try and find any differences but if anyone could let me know where abouts to look I'd be very grateful.
Cheers, Damian.

I've sorted it - sort of! Thanks for the tips Robert. I found some code that makes the browser emulate IE7 and stuck it in here...
<b:if cond='data:blog.isMobile'>
<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum
scale=1.0'
name='viewport'/>
<b:else/>
<meta content='width=1100' name='viewport'/><meta content='IE=EmulateIE7' http-
equiv='X-UA-
Compatible'/>
</b:if>
The
<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
is the bit I added. The blog now works correctly on IE8.
It's working, but have I put the code in the right place? Is there any better way of sorting this?
Edit - This code makes IE8 emulate IE7, but leaves IE9, IE10, and chrome alone...
<meta content='IE=7,IE=9, IE=10, chrome=1' http-equiv='X-UA-Compatible'/>
Here's where I found it.

Related

My CSS will work in every browser but not ie8, the layout of it all goes funny and displays wrong

Some of my CSS wont work in IE8 but will work in chrome,firefox,IE11.
I first made the website on chrome and then realized it didnt work in ie11 so I put code into the html like the code below...
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
After putting this, my website works on ie11. Later to find out, that it does not work on ie8.
I am making this website for my company and all around the company ALL the staff use different browsers, so I need to make sure it works on all.
Do I have any hope? or do I have to give up on this one? I have researched all over google about everyone different code inserts they put in for it to work on ie8 but it doesnt work.
In my CSS im using stuff such as border-radius and box-shadow and many many more.
Is there an alternative... to say, "if you are using ie8 to display this website, display this piece of code differently to suit the browser."
Thanks
What you are basically looking for is "graceful degradation". Check out some articles about that here:
https://www.w3.org/wiki/Graceful_degradation_versus_progressive_enhancement
http://searchnetworking.techtarget.com/definition/graceful-degradation
In any case, keep in mind that making a modern page work on IE8 is a tedious task, and most likely unnecessary. The global market share for IE8 is currently around 1%, so you really have to consider if you do that extra work.

Doctype is commented out in Internet explorer 11

I have red all the questions and answers on this issue. Still it didn't help. In my IE 11, the doctype is always commented out.
I think IE is Rendering the page in compatibility view. I am assuming this because some html properties such as border-radius are red underlined as if IE 11 not recognizing it, so I think that IE is not Rendering the page in Standard mode, though in developers tool Edge is selected.
I have chekced all the compatibility Settings. Everythings is unchecked and fine.
The Website was previously running on IE8 and was optimised for that.
Could you please post a code snippet of your current HTML document?
I would try to do it like this:
<!DOCTYPE html>
I added the following meta-tag to my webpage and it works for me:
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
I found it on this post

IE9 white flash on page change

I am trying to find a solution of the IE white flash in a meteor app.
The website is this one (note that it's in closed beta).
IE9 gives a very bad user experience, and while I don't think it will ever be as good as with more modern browser, I really think some issues should be resolved.
And I think that the white flash on page change it's the worst one.
Basically for every action that changes the url, the page redraws itself and flashes white for a few milliseconds.
I've read other topics and tried to apply some of the suggest fixed, but nothing worked.
I've tried to insert
<META HTTP-EQUIV="Page-Exit" CONTENT="BlendTrans(Duration=0.0)">
<META HTTP-EQUIV="Page-Enter" CONTENT="BlendTrans(Duration=0.0)">
But I think it does nothing on IE9 or in this case.
I also tried to set the background of html and body to dark gray, it did nothing.
I'm actually not sure what else should I try and if this is a common issue when building website with realtime, modern frameworks.
Thanks in advance.
P.S. I also found this issue in iron-router, and it seems that IE<10 trigger a full page refresh every time, and probably that's the main cause of what I'm seeing, because Meteor needs a bit of time to load itself, thus leaving the page blank while it's doing it's magic.
this meta tags
<META HTTP-EQUIV="Page-Exit" CONTENT="BlendTrans(Duration=0.0)">
<META HTTP-EQUIV="Page-Enter" CONTENT="BlendTrans(Duration=0.0)">
not supported in IE9.
As solution for you example you can use compatibility with IE8
you can add
<meta http-equiv="X-UA-Compatible" content="IE=8" />

IE10 random image rendering issue

I have a website which displays fine on all browsers (even lower versions of IE than IE10). But, on IE10, the images are having rendering issues like the screenshot attached below. If would have random colored bars on it at random times, but once refreshed it would be okay. I don't have any Javascripts on the page, just the styling to display the images. Any ideas? I tried googling and on StackOverflow but no luck. Do I need to put some sort of meta tags?
Check about "Compatibility View" Option.
and why don't you try the edge meta tag?
<meta http-equiv="X-UA-Compatible" content="IE=edge">

Internet Explorer 9 - CSS Breaking

I have this mock up HTML/CSS website here that is working perfectly fine on Firefox/Chrome but on Internet Explorer, the organization of the page is breaking; footer div is coming to the header section). I have tried to debug it but no luck.
It would be great if you can take a look into it and give me some pointers.
https://www.csupomona.edu/~tahoang/tu-template/
Thanks!!
You have a couple of duplicate IDs in use. I would start by fixing those.
http://validator.w3.org/check?uri=https%3A%2F%2Fwww.csupomona.edu%2F~tahoang%2Ftu-template%2F&charset=%28detect+automatically%29&doctype=Inline&group=0
Looks fine to me in IE 8, IE 9 and Chrome. Do you have compatibility view enabled in IE 9?
I also notice in the Footer that you having a bunch of the columns positioned relatively, there is no need for that. You may remove that.
Try adding this to the <head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
Also fix those duplicate IDs Tim mentions, but this Meta tag will fix all your IE9 problems ;)