Höhenverhältnis zum Gesamtbildschirm bei eingeblendeter Smartphone-Tastatur beibehalten

[Black Pearl]

Hallo liebe Forengänger,

bevor ich mein Problem erläutere, kurz ein Vorwort: Das Projekt, an dem ich arbeite, ist nicht für die Öffentlichkeit gedacht, sondern für einen eingewiesenen Nutzerkreis vor Ort. Es handelt sich um die Wertungsmaske eines Kampfrichters, der vorher mit der Technik vertraut gemacht wurde. Darum sind meine Vorstellungen ziemlich fest und richten sich nicht an einer nutzerfreundlichen Darstellung aus. Hierbei steht die Praxis vor Ort im Mittelpunkt.

Ich habe im Grunde eine recht einfache Seite (position:fixed + width und height auf 100%), die grob gesagt aus zwei DIVs besteht. Das obere DIV hat eine Größe von 60%, das untere eine von 40%. Soweit funktioniert alles problemlos, besonders im PC. Bei jeder Bildschirmänderung bleibt alles, wie es ist.

Nun gibt es jedoch das Problem Smartphone/Tablet. Da sich im oberen DIV ein Inputfeld (type=text) befindet, öffnet sich notwendigerweise die Tastatur am unteren Bildschirmrand. Dadurch wird nun jedoch das komplette Bild gestaucht, was ich aus optischen Gründen gern vermeiden möchte. Idealerweise soll sich die Tastatur einfach über den unteren 40% öffnen, sodass die oberen 60% optisch unverändert stehen bleiben. Natürlich könnte ich nun alles auf fixe Pixelwerte ändern, was aber sehr ungünstig wird, da die genutzten Endgeräte sehr unterschiedlich sein können, aber die identische Optik haben sollen.

Habt ihr eventuell einen Geheimtipp für mich, wie ich die Höhen optisch beibehalten kann, wenn sich die Tastatur öffnet? Meine Idee wäre ein Messen der gesamten Display-Maße und nicht nur die des Browser-Fensters. Ist so etwas möglich?

Liebe Grüße

Daniel