|
|||
Android Browser: leerer, scrollbarer Bereich unter Dokument
Hallo!
mir ist ein seltsames Problem beim Betrachten von manchen Webseiten auf mobilen Browsern aufgefallen: Wenn ich den Browser meines Smartphone (Chrome) im Porträtmodus verwende und mir darauf Webseiten anschauen, die etwa quadratisch sind, oder deren Breite gar größer ist als deren Höhe. Und wenn ich in diese Webseite hineinzoome, so dass ich den Inhalt lesen kann und dann nach unten scrolle: Unterhalb des eigentlichen Inhalts lässt sich die Seite noch mehr oder weniger weiter nach unten scrollen, obwohl dort eigentlich kein Inhalt mehr ist, nur leerer Bereich. Bei Desktop-Browsern (zum Test: deren Fenster verkleinern, so dass der Inhalt scrollbar wird) ist es so, das am unteren Rand des HTML-Inhalts das Scrollen endet. Das stört, da teilweise <body>-Hintergründe unter das Dokumentende hinausragen, oder wenn mann nach unten scrollt, man über das Dokumentende hinausscrollt. Ich habe dazu eine kleine Testseite geschrieben, zur besseren Erkennbarkeit habe ich die einzelnen Bereiche eingefärbt: rot=<html>, grün=<body>, gelb=<div> Das Dokument besteht nur aus einem breiten <Div>-Block. Mein Wunsch: wenn ich hineinzoome und nach unten scrolle, dass das Scrollen an der unteren Kante des DIV endet (wie eben bei Desktop Browsern). Ich habe mich schon viel mit Viewport-Einstellungen herum gespielt, auch mit der Verwendung der CSS-Eigenschaft "overflow" für die Bereiche <html> und/oder <body>, leider ohne Erfolg. Hat jemand eine Idee, warum sich hier mobile Browser anders verhalten wie Desktop-Browser und was man dagegen tun kann? Außerdem bei manchen Seiten scrollt z.B. Chrome-Mobile weiter, wohingegen der Stock-Browser von Android 4.1 das nicht tut. Auf anderen Seiten scrollt aber auch der Stock-Browser weiter in den leereren Raum. HTML-Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=980, initial-scale=1.0"> <title>Test</title> <style type="text/css"> html {background-color:#FF0000;} body {background-color:#33FF00;} </style> </head> <body> <div style="width:900px; height:200px; background-color:#FFFF00">Der DIV-Block</div> </body> </html> |
Sponsored Links |
|
||||
Weil das Browserfenster kleiner als 980 Pixel ist?
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato... All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege www.richard-thiel.de | Müssen Websiten überall gleich ausschauen? |
Sponsored Links |
|
|||
Ich hab mich jetzt noch mit einigen Einstellungen der Viewport-Breite und den backgrounds von <html> und <body> herumgespielt.
Mein Ziel wird's wohl auf dem Chrome-Mobile und vermutlich auch anderen mobilen Browsern nicht spielen. Die Browserseite wird einfach mit der angegebenen Viewportbreite (oder mit der Breite eines noch breiteren Elements) und mit einer daraus automatisch ermittelten Höhe von ca. 1,6 x dieser Breite samt <body>-Hintergrund gerendert. Auch wenn dieser im Prinzip leere Hintergrund keine HTML-Elemente mehr enthält. Zoom ich nun herein, so wird nicht mehr neu gerendert, sondern der ganze leere, scrollbare untere Bereich bleibt bestehen. Dies ist ein ganz wesentlicher Unterschied zum Desktop-Verhalten, wo der scrollbare Bereich mit dem unteren Ende des letzten HTML-Elements endet. Je größer das Verhältnis Viewportbreite (oder Breite eines noch breiteren HTML-Elemts) bezogen zu der Dokumenthöhe ist, desto mehr scrollbarer Leeraum bleibt unterhalb noch. |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Scrollbarer, in der größe beschränkter Bereich in der Seitenmitte | DerStefan | CSS | 1 | 20.01.2011 22:52 |
div bereich am ende des dokument laden? | wstbln | CSS | 7 | 28.12.2005 01:25 |
css - scrollbarer Bereich? | timo_81 | CSS | 11 | 06.02.2005 10:41 |