Iframe issue resizing whole web page

Discontinued products DHTMLX Touch
#1

I am doing a catalogue of web sites (simple HTML5 web page) and want to use iframe to give access the the sites from the catalogue.

I tried the following simple test page:

		<script type="text/javascript" charset="utf-8">
			dhx.ready(function(){
				dhx.ui.fullScreen();
				dhx.ui({
					rows:[
						{view:"toolbar", id:"header", elements:[
						{view:"button", label:"Back", width:80, align:"right"},						
						{view:"label", id:"header_label", label:"Vetero", align:"middle"},
						{view:"button", label:"Info", width:80, align:"left"}
						]},
						{view:"iframe", id:"viewer", src:"http://www.yahoo.com"}
					]
				});
			});
		</script>

That works fine on all Desktop browsers, but on the Android default browser it resizes the header to such a small size that it can not be seen unless you zoom it. It seems to resize the whole page so the web site in the iframe fits within the space available.

Any solution to ensure that the header keeps it correct size so it can be used and not affected by the size of the web site in the iframe.

#2

Do you have the next html code on the master page ?

<meta  name = "viewport" content = "initial-scale = 1.0, maximum-scale = 1.0, user-scalable = no">
#3

Thanks that worked.

I replaced it with:

	<meta name="viewport" content="width=device-width, initial-scale=1">

which allows the user to rescale if needed.

Also without the meta adding this also seem to work but with less control (no rescaling by user):

            dhx.ui.fullScreen();