zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden Android Browser: leerer, scrollbarer Bereich unter Dokument

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 09.09.2015, 11:59
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.09.2015
Beiträge: 2
schach befindet sich auf einem aufstrebenden Ast
Standard 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>
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 09.09.2015, 13:33
Benutzerbild von Thielo
Web Ninja
XHTMLforum-Kenner
 
Registriert seit: 17.09.2009
Ort: Stuttgart oder so
Beiträge: 3.372
Thielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein Lichtblick
Standard

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?
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 09.09.2015, 19:44
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.09.2015
Beiträge: 2
schach befindet sich auf einem aufstrebenden Ast
Standard

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.
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ä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


Alle Zeitangaben in WEZ +2. Es ist jetzt 15:19 Uhr.