Currently all browsers are showing my page correctly except IE8, which is having a mystery alignment issue.
I already added the meta that worked for previous questions:
<meta http-equiv="X-UA-Compatible" content="IE=edge">
However this has not fixed the problem.
Can you please look at my page to see if anything looks incorrect?
http://oldcalifornia.com/Exterior_Craftsman.asp
Thank you,
Robert
Your site is designed using tables, tables shouldn't be used for anything except displaying tabular data. Consider redesigning your site using divs.
I have also suffered this issue. Add standard doctype declaration:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
I am not sure, but try if this would work.
Related
Does anyone know a solution to my problem or where I should look for this to work?
I am working on a website ( http://www.awww.nl ) and I got all the positioning of the elements the way I wanted... but when I checked in IE most of the positioning is totally off!
Especially on the post pages (for example: http://awww.nl/superlieve-luiaard/ ) the design is moving all the way to the right in IE (in chrome on my Imac everything is correct) And on the homepage the button to add pictures disapears.
I tried to fix it by using different Doctypes but that didn't work.
Your website is rendering in Quirks mode, probably because of a doctype mistake.
I do not recognize your current doctype:
<!DOCTYPE XHTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Can you try changing your doctype to this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
If that doesn't fix it, then add to the <head> tag:
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
This should render it in the highest version available. However, I would recommend that you look for the doctype mistake and fix it as it is the root of the cause.
I have two doctypes above my <html> tag and I still don't see it in my page source. I tried just using one of them but they still dont work. Here is the site URL http://nonudot.io-web.com/demo.aspx and the doc types I'm using:
<!DOCTYPE HTML>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Heres a link to a screenshot of the code http://nonudot.io-web.com/LCValleyADA/media/ProjectsContent/Capture.JPG
Thanks
Your screenshot doesn't look anything like the final output. Compare the following
with
Notice how the meta tag <meta http-equiv="pragma" content="no-cache" /> doesn't exist in the second screen grab (my screen grab from your posted site)? That's most likely because your not using the same page... I'm assuming that you might not be using the correct MASTERPAGE, or something has gone awry with your masterpages.
Your style sheets don't match up either.
How can I force Internet Explorer 9 to use standards document mode? I built a website and I'm finding that IE9 uses quirks mode to render the website pages. But I want to use standards mode for rendering.
<!doctype html>
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
This makes each version of IE use its standard mode, so IE 9 will use IE 9 standards mode. (If instead you wanted newer versions of IE to also specifically use IE 9 standards mode, you would replace Edge by 9. But it is difficult to see why you would want that.)
For explanations, see http://hsivonen.iki.fi/doctype/#ie8 (it looks rather messy, but that’s because IE is messy in its behaviors).
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
The meta tag must be the first tag after the head tag or it will not work.
There is something very important about this thread that has been touched on but not fully explained. The HTML approach (adding a meta tag in the head) only works consistently on raw HTML or very basic server pages. My site is a very complex server-driven site with master pages, themeing and a lot of third party controls, etc. What I found was that some of these controls were programmatically adding their own tags to the final HTML which were being pushed to the browser at the beginning of the head tag. This effectively rendered the HTML meta tags useless.
Well, if you can't beat them, join them. The only solution that worked for me is to do exactly the same thing in the pre-render event of my master pages as such:
Private Sub Page_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreRender
Dim MetaTag As HtmlMeta = New HtmlMeta()
MetaTag.Attributes("http-equiv") = "Content-Type"
MetaTag.Attributes("content") = "text/html; charset=utf-8;"
Page.Header.Controls.AddAt(0, MetaTag)
MetaTag = New HtmlMeta()
MetaTag.Attributes("http-equiv") = "X-UA-Compatible"
MetaTag.Attributes("content") = "IE=9,chrome=1"
Page.Header.Controls.AddAt(0, MetaTag)
End Sub
This is VB.NET but the same approach would work for any server-side technology. As long as you make sure it's the last thing that gets done right before the page is rendered.
put a doctype as the first line of your html document
<!DOCTYPE html>
you can find detailed explanation about internet explorer document compatibility here: Defining Document Compatibility
To prevent quirks mode, define a 'doctype' like :
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
To make IE render the page in IE9 document mode :
<meta http-equiv="x-ua-compatible" content="IE=9">
Please note that "IE=edge" will make IE render the page with the most recent document mode, rather than IE9 document mode.
Make sure you take into account that adding this tag,
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
may only allow compatibility with the latest versions. It all depends on your libraries
I tried with an alternate method:
Hit F12 key
Then, at right hand side in the drop down menu, select internet explorer version 9.
That's it and it worked for me.
Make sure you use the right doctype.
eg.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
or just
<!doctype html>
and also read and understand how compatibility modes and developer toolbar for IE work and set modes for IE:
I have faced issue like my main page index.jsp contains the below line but eventhough rendering was not proper in IE. Found the issue and I have added the code in all the files which I included in index.jsp. Hurray! it worked.
So You need to add below code in all the files which you include into the page otherwise it wont work.
<!doctype html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
</head>
I am building a webpage, and I found a problem which I cannot solve. If I declare the DOCTYPE, the page breaks completely, and if I don't declare it, the IE version won't work properly (the drop down menus won't drop). But, despite of it's broken, if I declare the DOCTYPE, the dropdown menus work at every explorer, including IE. So I really don't know what to do, any idea? I'm currently declaring the DOCTYPE as: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> but I've tried other options and they don't work neither.
Last time I posted here the free server blocked the page (probably too many users, as I'm the only one getting in currently), but these are 2 examples of the page:
with DOCTYPE: http://newfutureuniversity.org/project/
without DOCTYPE (dropdown menus not working with IE9):
http://newfutureuniversity.org/learn/
Any help would be appreciated. Even if it's just to orientate me about where to start searching, as I could't find anything similar.
Using or not using the doctype for modern web pages is no longer optional and is required. It is the very first thing that goes down on a page and never changes. If you created a page without one to begin with, then your whole page is set in quirks mode. Trying to fix it or change it by adding/removing the doctype is, essentially, changing the rules and the target as you go along.
Trying to use jQuery to fix this now is just sinking you into a deeper hole. Add the doctype, use a modern browser to get everything how you want it (IE is not a modern browser), then work on getting IE to follow along.
The charset you should be using is <meta charset="utf-8">
for HTML5 it is nice and small, you have an XHTML declaration
it can simply be:
<!DOCTYPE html>
for HTML 5
Using XHTML tells the parser to be much more strict in what it accepts. you have no <html> root in your document (HTML5 won't care about this).
content type specification is different in HTML5 as well
instead of <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> you can use <meta charset="iso-8859-1" /> if that is your desired character set.
Is it ok not to include such lines in a HTML file? Removing these lines makes the code look more clean.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
When I use dreamweaver to create a HTML file, these lines are automatically included.
No, you should NOT remove those lines.
You can, however, switch the <!doctype>-declaration to the one of HTML5, since that will still trigger standards mode in all current browsers, even though they don't yet implement HTML 5. It looks like the following:
<!DOCTYPE html>
Which is a bit more clean than the ordinary one you use looks like. You can also read a little more about the new doctype-declaration here. You can also learn more about what will change in HTML5 here.
No that is not allowed. It sets the character encoding, i.e. how the browser should read it.
But the new HTML5 elements make the whole thing look easier and cleaner. So:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
becomes --> <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
lang="en"
xml:lang="en">
becomes --> <html lang="en">
<meta http-equiv="Content-Type" content="text/html;
charset=UTF-8">
becomes --> <meta charset="UTF-8">
<link rel="stylesheet" href="style.css" type="text/css">
becomes --> <link rel="stylesheet" href="style.css">
So the whole code in the <head> becomes:
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
No, you shouldn't remove these lines. The first two lines tell the browser what type of document your page is, and helps the browser render it properly.
The third line tells the browser what character set you're using, in this case so that it knows to render non-latin characters properly.
Those declares the DOCTYPE, which shouldn't be forgotten to add.
Why?
Why specify a doctype? Because it
defines which version of (X)HTML your
document is actually using, and this
is a critical piece of information
needed by browsers or other tools
processing the document.
For example, specifying the doctype of
your document allows you to use tools
such as the Markup Validator to check
the syntax of your (X)HTML (and hence
discovers errors that may affect the
way your page is rendered by various
browsers). Such tools won't be able to
work if they do not know what kind of
document you are using.
But the most important thing is that
with most families of browsers, a
doctype declaration will make a lot of
guessing unnecessary, and will thus
trigger a "standard" parsing mode,
where the understanding (and, as a
result, the display) of the document
is not only faster, it is also
consistent and free of any bad
surprise that documents without
doctype will create.
You can remove the DOCTYPE, html tags and meta tags and still have valid HTML, and if you are happy for your page to take browser default styling they can be safely omitted. The content type and charset can be specified by the HTTP headers if you prefer. As others have already pointed out, the DOCTYPE will affect how styling instructions are interpreted, and also how HTML parsers interpret some invalid markup, so you will need to allow for this.