Jan Andersson
I have a coach that is supposed to be viewed on a mobile phone. It uses the Responsive Sensor on top level and within that a Vertical Layout. It looks pretty good except for one thing: I have not been able to set the coach to cover 100 % of the available screen height. I have tried with various settings of the Vertical Layout to no avail. From what understand, the problem might be related to that setting a container to e.g. 100 % just sets it to cover 100 % of the enclosing container, which ultimately is the entire web page being displayed. So I would need to set the entire page to 100 % of the available screen size. I don’t know how to do that.
Any suggestions?
Regards, Jan
Andrzej Michalec
Sounds like I am not the only one struggling with 100% height… a week ago I have asked the same question “how to stretch widget height to 100%” that remains unanswered to date.
regards,
-andy.
Jan Andersson
From your findings it sounds like my suspicion was right – but that it’s even more complicated than I though. I really hope someone comes up with a solution – with mobile phones, it’s important that the coach is correctly sized to its display.
Rgds, Jan
Jan Andersson
A colleague of mine found the vh css unit, standing for Viewport Height. E.g. 95vh means 95 % of the available viewport. It can be used with the Height config option of a Vertical Layout (and most likely with all height related css constructs).
https://www.w3schools.com/cssref/css_units.asp
Regards, Jan
SPARK Support
Hi Jan,
Can you attach a small sample TWX containing an example of the issue?
Regards,
Stephen P.
Jan Andersson
Well, the solution is in my posting #3706. Use the unit vh to set the height to a percentage of the available viewport. So no need for further investigation. Thanks anyway. Rgds, Jan
SPARK Support
Hi Jan,
Thank you for the feedback.
Regards,
Stephen P.
