1

For HTML4 to HTML5 conversion I've been comparing my html4 vs html5 pages against one another and have seen that getting rid of the depreciated elements after doctype is causing on screen elements to sometimes move ever so slightly. Ex. In the below code, the anchor tag has what looks like a 3 pixel padding on the bottom that doesn't show up in debug tools, but visibly is shifting down in HTML5.

<header>
<a href="javascript:commonSubmit('displayHomePage')"><img class="noBorder" src="images/logo.png" alt="Home" /></a>
<div id="nav">
...

Also, in a very large template generated table, some information in some cells occasionally shift a pixel or 2 up and over. No style changes occurred on the pages, just altering the doctype does this.

The only code change to occur, which causes the shifts: Before:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

After:

<!DOCTYPE HTML>
TheBeeKeeper
  • 225
  • 2
  • 12
  • This might help - http://stackoverflow.com/questions/1818587/what-is-the-functionality-of-doctype – Stickers Jan 14 '16 at 14:57
  • 1
    The first issue is the archetypical change that you get when switching from almost-standards mode (the HTML 4.01 Transitional doctype) to standards mode (the HTML 5 doctype), so just search for descriptions of almost-standards mode. There's not enough information to identify the second issue, but it's probably also somehow down to the line-height computation.. – Alohci Jan 16 '16 at 01:29

1 Answers1

0

As found on w3schools

The <!DOCTYPE> declaration must be the very first thing in your HTML document, before the <html> tag.

The <!DOCTYPE> declaration is not an HTML tag; it is an instruction to the web browser about what version of HTML the page is written in.

Basically, it let's the browser know which HTML version you're using to properly render the elements

Before: This is HTML 4.01

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

After: This is HTML5

<!DOCTYPE HTML>

Hope this helps!

Mr Lister
  • 45,515
  • 15
  • 108
  • 150
Mike Donkers
  • 3,589
  • 2
  • 21
  • 34
  • I get that. But just changing to HTML5 is causing visible changes to how things appear on screen that have no style applied to them. In some cases, like with my generated table data, the exact same code appears differently in different spots when comparing the same page back to back between the HTML5 and HTML4.01 versions. – TheBeeKeeper Jan 14 '16 at 14:14
  • This is because `HTML5` interprets HTML code differently than `HTML4.01` does – Mike Donkers Jan 14 '16 at 14:17
  • [w3schools derives its name from the World Wide Web (W3), but is not affiliated with the W3C.](http://www.w3schools.com/about/default.asp) – Alohci Jan 16 '16 at 01:41
  • 2
    @TheBeeKeeper That is because if you don't have a doctype declaration, you're basically not using a standardised HTML version at all, and the browser reverts to "quirks mode". For more info, search for "quirks mode" and/or "standards mode". [This MDN page](https://developer.mozilla.org/en-US/docs/Quirks_Mode_and_Standards_Mode) is nice. – Mr Lister Jan 18 '16 at 14:52
  • @Simplicity Can you give an example of some HTML that is interpreted differently in HTML5 and HTML4 by the browsers? In my experience, using a proper doctype declaration will always invoke the HTML5 parser. – Mr Lister Jan 18 '16 at 14:55
  • @MrLister if you take a look at what TheBeeKeeper asked, in particular the difference between the doc types you'll see that the first one explicitly uses the HTML4 parser – Mike Donkers Jan 18 '16 at 18:49
  • @Simplicity Oh no, almost-standards mode; I forgot about that one. So, yes, you're right, but that's the same difference as the one between HTML4 Transitional and HTML4 Strict ([this fiddle](http://jsfiddle.net/MrLister/nwstujvf/2/) and [this one](http://jsfiddle.net/MrLister/nwstujvf/3/]).) No differences in parsing, only in display. – Mr Lister Jan 18 '16 at 19:42
  • @MrLister which is what the question was about, displaying – Mike Donkers Jan 18 '16 at 19:48