2

There is my source:

Source by Firefox

As you can see the source is correct, but Firefox reports an error.

Now look at the console of Firefox:

Firefox console

There is a miss interpretation: The original content between the header tags (css, scripts) you can find in the body.

Same problem Chrome console:

Chrome console

Here you also can see some whitespace after the beginning body-tag - it seems that there is the problem.

I built my own, easy template engine, looks like this:

    ob_start();     
    include $this->templateLocation; // includes the template
    $content = ob_get_clean();
    template::$pageContent = $content; // saves template for echoing later

I assume that the reason of this error is that code-snippet of the template engine, because maybe something is outputted before it should? I am really desperated...:(

EDIT:

See the whole code:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="de-DE">
<head profile="http://gmpg.org/xfn/11">

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<title>Seitentitel</title>

<!-- <link rel="icon" href="http://localhost/dating/wp-content/themes/dating/images/favicon.ico" /> -->
    <link rel="stylesheet" href="http://localhost/dating/wp-content/themes/dating/style.css" type="text/css" media="all" /><link rel="stylesheet" href="http://localhost/dating/wp-content/themes/dating/css/chooseCity.css" type="text/css" media="all" /> <script type="text/javascript" src="http://localhost/dating/wp-content/themes/dating/js/jquery-1.11.0.min.js"></script><script type="text/javascript" src="http://localhost/dating/wp-content/themes/dating/js/config.js"></script><script type="text/javascript" src="http://localhost/dating/wp-content/themes/dating/js/dateHoster.chooseCity.js"></script>  
</head>
<body>
user1711384
  • 343
  • 1
  • 7
  • 24
  • 1
    The problem doesn't occur if I copy/paste the code into a new document. That suggests you have some invisible character in the document. Run it through [a validator](http://validator.w3.org) as that will probably pick it up. – Quentin May 15 '14 at 10:15

3 Answers3

1

My own solution:

Some PHP-files were encoded with UTF indead of UTF without BOM, which causes the miss interpretation.

user1711384
  • 343
  • 1
  • 7
  • 24
0
  1. Open the PHP file using notepad++
  2. in Encoding tab, select "Convert to UTF-8". It removes the BOM from the start of file.
Ali Sheikhpour
  • 10,475
  • 5
  • 41
  • 82
-1

Your viewport meta tag is missing it's self closing end. Try:

<meta name="viewport" />

EDIT: Also, it's hard to see exactly, but you may have two closing script tags.

graphicdivine
  • 10,937
  • 7
  • 33
  • 59
  • It doesnt seem that the problem is the HTML-Code. When I deleted the whole code between the header-tags, firefox reports still an error (red color). – user1711384 May 15 '14 at 09:02
  • The "self closing end" is nonsense, this isn't XHTML and if it was, the error would be a yellow screen of death, not a misordered DOM. – Quentin May 15 '14 at 10:13