<head> erscheint in Chrome leer

StackOverflow https://stackoverflow.com//questions/10695620

Frage

Wenn ich meine Website mit der letzten Version von Google Chrome durchsuche und F12 verwende, um in die Quelle zu schauen, werden alle Inhalte dazwischen angezeigt <head> Und </head> erscheint leer.In den letzten Versionen von Firefox und IE wird alles korrekt angezeigt.

Tatsächlich wird der Inhalt in Google Chrome in den Textkörper verschoben.

Es ist offensichtlich kein CSS-Problem.Ich verwende Twitter Bootstrap CSS und JS sowie ein MVC-PHP-Framework.Hat jemand einen Hinweis?

Hier ist meine document.html-Seite:

<!DOCTYPE html>
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />

<title><?php echo (Template::$titre); ?></title>

<?php foreach(Template::$meta as $key=>$value): ?>
        <meta name="<?php echo $key; ?>" content="<?php echo $value; ?>" />
<?php endforeach; ?>

<link rel="shortcut icon" href="<?php echo WEB; ?>assets/style/favicon.ico" type="image/x-icon" />  

<link rel="stylesheet" href="<?php echo WEB; ?>assets/style/bootstrap.min.css" />   
<link rel="stylesheet" href="<?php echo WEB; ?>assets/style/bootstrap-responsive.min.css" />    
<link rel="stylesheet" href="<?php echo WEB; ?>assets/style/main.css" />    
<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>

<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head> 
<body>
<?php require Template::child(); ?>
(...)

Und die angesehene Quelle von Firebug:

<html lang="fr"><head></head><body>?


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

<title>Vélos d'occasion dans toute la France</title>
<meta name="keywords" content="velos d'occasion, velos dans toute la France, velos occasion Toute la france, velo occasion, velo">
<meta name="description" content="Petites annonces de velos d'occasion dans toute la France, velo d'occasion à vendre Toute la france">

<link rel="shortcut icon" href="/assets/style/favicon.ico" type="image/x-icon"> 

<link rel="stylesheet" href="/assets/style/bootstrap.min.css">  
<link rel="stylesheet" href="/assets/style/bootstrap-responsive.min.css">   
<link rel="stylesheet" href="/assets/style/main.css">   
<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->


<section id="maincontainer">
<div class="container">
(...)

Bearbeiten :Problem gelöst, Notepad++ kodierte in UTF8, ich wechselte zu ANSI und funktionierte einwandfrei.

War es hilfreich?

Lösung

Am Anfang Ihres Dokuments befindet sich ein fehlerhaftes Zeichen.

Ich habe Ihre Seite durch den W3C-Validator laufen lassen und es zeigt:

Fehlerzeile 1, Spalte 1:Nicht-Raum-Zeichen gefunden, ohne zuerst einen docType zu sehen.Erwartet <!DOCTYPE html>.

http://validator.w3.org/check?uri=http%3A%2F%2Fveloccasion.net%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

Dies scheint dazu zu führen, dass Chrome Ihren Dokumenttyp verwirft und die Seite im Quirks-Modus rendert, wie Sie an der lustigen Schaltfläche und den Textfeldhöhen erkennen können.Versuchen Sie, alles Seltsame vor dem DOCTYPE zu löschen (oder entfernen Sie den DOCTYPE und geben Sie ihn erneut ein).

Andere Tipps

Um auf Elijahs Antwort aufzubauen, verwenden Sie STRG+U, um die Quelle in Chrome und Firefox anzuzeigen.

Ich habe gerade nach Chrome gesucht und es ist NICHT leer.

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

<title>Veloccasion - V&eacute;los d'occasion dans toute la France</title>
<meta name="keywords" content="velos d'occasion, velos dans toute la France, velos occasion Toute la france, velo occasion, velo" />
<meta name="description" content="Petites annonces de velos d'occasion dans toute la France, velo d'occasion &agrave; vendre Toute la france" />
<meta name="author" content="Veloccasion.net" />

<link rel="shortcut icon" href="/assets/style/favicon.ico" type="image/x-icon" />   

<link rel="stylesheet" href="/assets/style/bootstrap.min.css" />    
<link rel="stylesheet" href="/assets/style/bootstrap-responsive.min.css" /> 
<link rel="stylesheet" href="/assets/style/main.css" /> 
<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>

<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

F12 ist keine Quelle anzeigen.F12 ist der Dom-Inspektor.Ist es möglich, dass Sie den Kopf nur als zusammengebrochen ansehen?Standardmäßig wird es so angezeigt.

Bearbeiten:

Habe Dein Problem gefunden:

    <link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>

Dieses Tag wird nicht geschlossen.Du musst es mit beenden />

Bearbeiten:

Könnte es sein, dass Sie vorher einen Platz benötigen /> in dieser Zeile:

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

Ich habe es gefunden!

Drücken Sie in Chrome STRG+UMSCHALT+I,

...direkt nach dem <body> Tag gibt es eine Zeile mit viel leerem Text.Finden Sie das und löschen Sie es und das Leerzeichen verschwindet.Ich bin mir nicht sicher, was die Ursache ist, da ich Ihren Code nicht habe.

Ich hoffe es hilft

die Zeile darunter 

<link href="http://fonts.googleapis.com/css?family=Lobster"
 rel="stylesheet" type="text/css

Beachten Sie die "?" Versuchen Sie darin, diese Zeile zu entfernen und Quelle anzeigen

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top