html, body
{
margin:0;
padding:0;
width:100%;
height:100%;
min-height:100%;
min-width:100%;
}
#rahmen {
width:100%;
height:100%;
}
<script type="text/javascript">
adjust_screen();
</script>







// JavaScript Document
function adjust_screen()
{
windowH = window.outerHeight;
windowW = window.innerWidth;
screenH = screen.availHeight;
screenW = screen.availWidth;
if(windowH>screenH) {windowH = screenH }
if(windowW>screenW) {windowW = screenW }
tempH = (windowH/screenH)*200;
tempW = ((windowW/screenW)-0.25)*4;
document.getElementById('rahmen').style.height = windowH + "px";
document.getElementById('rahmen').style.width = windowW + "px";
if(tempH < tempW) { size = tempH; } else { size = tempW; }
document.getElementsByTagName('body')[0].style.fontSize = size + "%";
}
// JavaScript Document
function adjust_screen()
{
windowH = window.outerHeight;
windowW = window.innerWidth;
screenH = screen.availHeight;
screenW = screen.availWidth;
screenH = 600;
screenW = 800;
tempH = (windowH/screenH)*100;
tempW = (windowW/screenW)*100;
if(tempH < tempW) { size = tempH; } else { size = tempW; }
size= Math.round(size)
document.getElementsByTagName('body')[0].style.zoom = size + "%";
document.getElementById('left_header').innerHTML = 'Zoom: '+size+'%';
}
onresize=adjust_screen;


da du ja, so wie ich es jetzt habe, für jedes HTML Element ne JS-Zoomfunktion schreiben müsstet.... 
) Bis auf den widerspenstigen Button funktioniert das schonmal soweit wie ich es mir vorgestellt habe.
Sollte das mit den Buttons auch noch hinhauen wäre das natürlich der Oberhammer, aber das ist schon nahezu perfekt
Danke dafür
)