IE10 <br> elements show unknown character icon - html

I have a site which, in ie10 ONLY is showing <br> and <br /> tags and diamonds with question marks (unknown character icons). I have changed char encoding (everything is UTF-8), DOCTYPE declaration (currently <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> ), meta http-equiv to all version and edge.
Again, I only have this problem in IE10 as far as I can tell. I have tried Chrome, Firefox and Safari also.
Has anyone experienced this also, or possibly have suggestions as to what might fix it. For now, I have simply removed the insert BR function in the WP add P tags for content filtering, and removed brs from the templates and other php generated html. This is not ideal for me or my client for multiple reasons, and I really would like to triumph over this stupid problem :)
Any help is much appreciated.

Related

Do modern browsers care about the DOCTYPE?

If you use deprecated attributes or tags <center>, <font color="red">, or <td valign="top"> etc. in XHTML 1.0 Strict (no depr. attributes), modern browsers (I will use Chrome as an example) still take notice of and use them.
If you use HTML5 <video> on an XHTML 1.0 Strict DOCTYPE Chrome will still recognize it - it's not as if they'd program it to not. I tested the worst deprecated, capitalized, and unquoted attribute code I could write, along with HTML5 audio, with the XHTML 1.0 Strict DOCTYPE in Chrome and it rendered flawlessly.
Here's the code I tested, working flawlessly in Chrome (red bg, centered table, audio playing):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Do browsers care about the DOCTYPE?</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
</head>
<body bgcolor=#ff0000>
<CENTER>
<table cellpadding="0" cellspacing=0>
<tr><td valign=top>test</td></tr>
</table>
</CENTER>
and some HTML5 audio..
<audio autoplay>
<source src="http://www.duncannz.com/resources/sound/alarm.mp3" type="audio/mp3">fallback text</audio>
</body>
</html>
So my question: Do modern browsers (translation: browsers other than IE) pay any attention at all, or do anything differently, because of the DOCTYPE? Do they even bother to read and interpret it?
Browsers do care about the DOCTYPE - otherwise there wouldn't be any point in having it!
You are right in saying that many browsers interpret old/deprecated commands in the correct way, but this is largely a matter of backwards compatibility. There is such a huge amount of content on the web that it is next to impossible to keep everything up-to-date and standards-complient. The web browsers continue to support these outdated pages because if they didn't, much of the content on the web would look slightly off. Most users don't know the difference between HTML4 and 5, so the blame could fall on the browser, which could be devastating - especially if a page looks bad on Firefox and nice on IE!
The DOCTYPE is mainly used in validation and to determine whether a browser runs in this "quirks mode" (where many of these older rules still work) or "standards mode" . Many professional web designers use the W3C validation tools to make sure their web pages are valid HTML, and the tools provided by their website look at the DOCTYPE to choose the correct set of rules with which to validate. Furthermore, XHTML strict does not allow empty tags or other blatant syntactic errors.
Hope this helps!
Try this in Chrome:
<!DOCTYPE html>
<title>Test case</title>
<p hidden>My text
<table><tr><td>Hello World</table>
against this
<title>Test case</title>
<p hidden>My text
<table><tr><td>Hello World</table>
Only in the former case will the text "Hello World" be visible.
In most Modern Browsers, you're not going to notice much difference (depending on the page) when using different Doctypes. The biggest difference you'll notice is not in your markup, but in your use of CSS, and the layout/positioning of elements. The Doctype is used when validating your pages, and in determining the mode, the browser renders the page in. So, depending on the Doctype you use, it will determine if the page is rendered in Standards mode, Quirks mode, etc. In IE, and older browsers, you'll notice much more of a difference.
For a more in-depth information on the subject, check out this link: http://hsivonen.iki.fi/doctype/
Yes, they do. It means the difference between Quirks or Standard mode, and can affect how IE handles box containers.
Have a look here:
http://www.quirksmode.org/css/quirksmode.html
And also here:
http://www.webmasterworld.com/forum21/7975.htm They discuss this topic in detail.
maybe the paragraph called "How DOCTYPES Affect Rendering" could help you?
http://www.upsdell.com/BrowserNews/res_doctype.htm
At the current date it is still possible to use DTD entities as variables in chrome/firefox/opera/ie in .xml and .xhtml and .svg and other xml-based files(breaks in .html files as I imagine it uses an html rendered instead of an xml renderer) without having to resort to javascript or php/other server-side preprocessor magic:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" [
<!ENTITY theword "bird">
<!ENTITY thexmlns "http://www.w3.org/1999/xhtml">
]>
<html xmlns="&thexmlns;">
<head>
<title>The word is &theword;</title>
</head>
<body>
<p>This document uses the word &theword; multiple times.</p>
<p>This document's word can be changed from &theword; by altering the entity.</p>
</body>
</html>
This seems like a useful test to see if doctypes still work(save the example above as example.xml or example.xhtml and see if it works).
So far I only found a realistic use for it in android projects xml files to use
entities inside attributes to prevent lines from having too much text one one line,
or from having the repeated long text in multiple attributes that could have a short entity encode them instead.

Why and how to use <!DOCTYPE>? [duplicate]

This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
What's up, Doctype?
HTML: What is the functionality of !DOCTYPE
Okay, when I first learn HTML, I basically learn from trial and error as I went along, and didn't really sit down to properly learn it as far as I can remember. As a result of this, I've missed out a lot, and therefore, I've decided to start from the basics for my own benefit. :) So here I am, (re-)learning HTML.
Now, my question - the <!DOCTYPE> tag confuses me more than any other HTML tag I've ever come across, so I've come here to clear up any questions I have regarding it so I can use it confidently. :)
Firstly, can someone explain to me why it's necessary to use a <!DOCTYPE> tag in your webpages? They work fine without them, don't they? I've read that it is so it can be validated against the standards of the W3C, but that's all I know. A little more detail would be appreciated. :)
Secondly, after reading up on it, I'm still confused as to what exactly goes in my <!DOCTYPE> and how to type it out. For example, this is one kind of DOCTYPE I've seen used:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Yet I've also seen other variations, and from what I've read, there are different DOCTYPES to validate against - it's all so very confusing, which should I use in my webpages if I was going to use one?
W3C has a pretty good answer to this at http://www.w3.org/QA/Tips/Doctype
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 some 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. 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" rendering mode.
Basically if you leave it out, the browser will try and guess what rendering mode to use, and it might cause some unexpected results.
it basically tells the browser how to interpret the page you're sending it. If you don't send anything, it has to make guesses. Some constructs are valid in a format while invalid in others, etc. Some browsers may display your page correctly while others don't. So yes, do choose and send a DOCTYPE.
There are several doctypes you can use, xhtml, html strict, html transitional, 4.01, etc. You can see a list of valid types here ... http://www.w3.org/QA/2002/04/valid-dtd-list.html
The declaration refers to a Document Type Definition (DTD). A DTD specifies the rules for the markup language, so that the browsers render the content correctly.
Going forward, for html5 compliance, the correct tag is simply:
<!DOCTYPE html>
You set a doctype to say to your browser or somthing else what you going tho do. Its look like what you do whit a business card
There are several doctype's. The most yoused doctype's are transitional:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/ xhtml1-transitional.dtd">
The some stricter doctype is: (see "strict")
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Also you can youse a speciffie doctype declaraition for youse a frameset. But this is outdated, frameset is a unnecessary for my but i will show you the doctype for this. But forgot the framesets this is an not useful html element whit html5. Here see you the follow frameset doctype:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
And at last. You can youse a language attribuut for your the doctypes. This can youse by html and xhtml.
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

Doctype breaking the document (Html5/Css3)

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 there any implication when changing DOC type definition even if your document may not be validated for that doc type?

Currently we have the following DOC type:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
There are some initiatives to change to the following DOC type:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 TRANSITIONAL//EN" >
The argument is for the enforcement of strict W3C standards for cross browser compatibility, my question is, if we adopt the new DOC type,
without changing parts of the codes that are still in the 4.0.1 HTML definition to XHTML 1.0 definition, will it be of any use?
will changing to the new DOC type definition cause my existing JSP / HTML to break (suppose those that conform to 4.0.1 perfectly but not tested against 1.0 XHTML)?
I'll assume that you actually mean the following as the new doctype:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Functionally, your JSP/HTML will not break. The modern webbrowser is forgiving enough and it'll close open tags where needed and it'll accept unspecified attributes. In the meanwhile you should however really consider to fix them anyway so that it w3-validates against the new doctype as much as possible.
However, major problems may arise in look'n'feel as specified by CSS. Your old doctype pushes the the browser in quirksmode which reveals among others the pretty serious box model bug in MSIE. With this bug, MSIE accounts the element's padding and border into element's width. So if you change this doctype, you'll only see changes in MSIE.
If your website was designed on normal webbrowsers according the web standards (i.e., it's been designed for Firefox, Chrome, Safari, etc), then you don't need to worry. It'll only going to look like in MSIE as intented, which is just an advantage.
But if your website was designed for MSIE and hereby thus ignoring the webstandards, then you'll have to make a lot of changes in CSS (mainly width/padding/border/margin) so that it look the same in MSIE as intented. You'll also gain the additional advantage that it will now look properly on normal browsers.
As to the doctype choice, well this is going to be subjective, but if you need my opinion, then read the following answers:
Should I start with HTML or XHTML?
Is it possible to use JSF+Facelets with HTML 4/5?

Does having multiple <HTML> element tags on one page cause problems

I cam accross this specific situation today. On a client's website, the pages had multiple tags, some even with conflicting Doctypes:
Ex:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>....</head></body>...</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head>....</head></body>...</body>
</html>
All this within the same page.
Will this cause any issues, if so which ones ?
The problem that this will cause is that it is invalid HTML and it is indeterminate how the content will be rendered.
This is pretty much the standard "web" answer, but basically it depends on how the browser handles it. It's obviously not standards-compliant HTML so it would be good to avoid it.
apart from that it is plain ugly and non-standard,
it has surely caused browser hickups in browser before, i dont know how the common browsers behave today.
i recall the day when one experimented with multiple body tags with different bgcolors to create a blinking background effect :)