Probleme bei hbox, hbox im Fully immer vertikal

Fritz Muster · 21 September 2017, 08:54:32

Hallo in die Runde,

ich kriege es nicht das eine hbox horizontal dargestellt wird. Mit dem Code

<li data-row="1" data-col="8" data-sizex="4" data-sizey="3">
<header>Temp. / Feuchte</header>
<div class="hbox">
    <div class="bg-red">Raumtemp.</div>
    <div class="bg-green bigger" data-type="label" data-device="EgSenThermWohnzimmer" data-get="measured-temp" data-unit="°"></div>
    <div class="bg-red tiny" data-type="symbol" data-device="EgSenThermWohnzimmer" data-get="battery" data-get-on='["ok","low"]' data-icons='["fa-battery-full fa-rotate-270","fa-battery-1 fa-rotate-270"]' data-on-colors='["SeaGreen","IndianRed"]'></div>
</li>
</div>

wird im Fully Browser (Version 1.19.2b-compat) auf einem Android 4.2.2 Tablet die Box immer vertikal ausgerichtet (siehe Bild im Anhang). Wenn ich auf dem selben Tablet mit Chrome mir die Seite anschaue ist alles wie es sein sollte (Bild ebenfalls im Anhang).

Das Ganze läuft via pagebutton und meine Index.html sieht so aus

Code Auswählen


<!DOCTYPE html>
<html>

<head>
<!--
     /* FHEM tablet ui */
     /*
     * UI builder framework for FHEM
     *
     * Version: 2.6.*
     * URL: https://github.com/knowthelist/fhem-tablet-ui
     *
     * Copyright (c) 2015-2017 Mario Stephan <mstephan@shared-files.de>
     * Under MIT License (http://www.opensource.org/licenses/mit-license.php)
     *
     * - create a new folder named 'tablet' in /<fhem-path>/www
     * - copy all files incl. sub folders into /<fhem-path>/www/tablet
     * - add 'define TABLETUI HTTPSRV ftui ./www/tablet Tablet' in fhem.cfg
     * - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
     */
    -->
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="widget_base_width" content="91">
    <meta name="widget_base_height" content="117">
	
	<meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
	<meta name='gridster_disable' content='0' >
	<meta http-equiv="X-UA-Compatible" content="IE=edge" >
	<meta name="widget_margin" content="3" >   <!--Abstand zwischen den Widgets-->
	<meta name="longpoll" content="1" >  <!--1=longpoll;0=shortpoll every 30sec -->
	<meta name="longpoll_type" content="websocket">
	<meta name='debug' content='1'>
	
	<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
	
	<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
    <link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />   
	<link rel="stylesheet" href="/fhem/tablet/www/customfonts/font1/style.css" />
	

	<script src="/fhem/pgm2/jquery.min.js" defer></script>
	<script src="/fhem/tablet/lib/jquery.toast.min.js" defer></script>
	<script src="/fhem/tablet/lib/jquery.gridster.min.js" defer></script>
	<script src="/fhem/tablet/js/fhem-tablet-ui.min.js" defer></script>
	
	<script type="text/javascript" src="station-clock.js"></script>
	<script type="text/javascript">
	
	  var clock = new StationClock("clock");
	  clock.body = StationClock.RoundBody;
	  clock.dial = StationClock.GermanStrokeDial;
	  clock.hourHand = StationClock.PointedHourHand;
	  clock.minuteHand = StationClock.PointedMinuteHand;
	  clock.secondHand = StationClock.HoleShapedSecondHand;
	  clock.boss = StationClock.NoBoss;
	  clock.minuteHandBehavoir = StationClock.BouncingMinuteHand;
	  clock.secondHandBehavoir = StationClock.OverhastySecondHand;

	  window.setInterval(function() { clock.draw() }, 50);

</script>
    <!-- Remove this line to enable for usage with WebViewControl 
    <script defer>
        var wvcDevices = {
            '12345': 'Tablet'
        };
        var wvcUserCssFile = "webviewcontrol.css"
    </script>
    <script src="../pgm2/cordova-2.3.0.js" defer></script>
    <script src="../pgm2/webviewcontrol.js" defer></script>
    End for WebViewControl -->
    <title>FHEM-Tablet-UI-Dev</title>
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="6" data-template="menu.html">
</li>
</ul>
</div>
</body>

</html>

Hat jemand eine Idee woran das liegen kann?

Vielen Dank und Grüße

Fritz

FHEM Forum

Probleme bei hbox, hbox im Fully immer vertikal

Fritz Muster