2011-01-02 5 views
1

Ich versuche, ein HTML5-Canvas-Element Vollbild mit den window.innerHeight und innerWidth-Eigenschaften zu machen.Vollbild-HTML-Element mit window.innerHeight/Breite anders mit DOCTYPE

Leider auf 10 Chrome, wenn ich setzen Sie den folgenden Doctype:

<!DOCTYPE HTML> 

... gibt es einige zusätzliche Scrollen Raum durch Scroll-Balken angezeigt werden, die nicht angezeigt werden sollen.

Ohne einen Doctype ist alles in Ordnung.

Das Element ist ein HTML5-Zeichenbereich, sodass das Formatieren mit 100% nur den Inhalt dehnt.

Lohnt es sich, einen Doctype zu verwenden, der meine Funktionalität unterbricht (ohne dass er schlecht ist?), Oder sollte ich 15px von den Werten abziehen, damit die Bildlaufleisten nicht erscheinen? (Das ist kludgy)

+0

Mit "Vollbild" meinen Sie wirklich "Füllen des Browser-Fensters"? – Phrogz

+0

Oh ja, danke, dass du das erklärt hast; Das ist es was ich meinte. –

Antwort

3

Es ist sicherlich wegen der Standard-Padding auf dem Body-Element der Seite gefunden. Entfernen Sie alle Standard-Padding und Margen mit:

* { 
    padding: 0; 
    margin: 0; 
} 
+0

Nur für "Körper" wäre genug. – Thai

+0

Ja, aber eine altmodische globale Padding/Margin-Reset ist in der Regel eine gute Idee mit diesen Dingen. –

+0

Danke Jungs. Ich hatte diese Stile früher dort, aber es muss nicht mit dem Dokument oder etwas enthalten sein. Ich ging trotzdem weiter und schrieb ein paar JavaScript, und jetzt funktioniert alles aus irgendeinem Grund gut. Danke noch einmal! –