Element size in Percentage

2 posts, 0 answers
  1. Manuel
    Manuel avatar
    1 posts
    Member since:
    Nov 2015

    Posted 25 Nov 2015 Link to this post


     I want to set the size of a div within my View to a certain percentage value via css. However, while this works in the Android-Simulator, on a device the height always resets to 0, so nothing is visible within the View-Element.

    My Code:


        position: absolute;
        height:height: 38%;
        background-image: url("../media/img/logo.png");
        background-position: 50% 50%;
        background-repeat: no-repeat;
        position: absolute;
        height: 55%;
        text-align: center;
        font-size: 24pt;
        overflow: auto;


     <div data-role="view" data-title="Home" data-layout="main" data-model="APP.models.home">
        <div id="logo"></div>
        <div id="imageText" data-bind="text:text"></div>

  2. Tsvetina
    Tsvetina avatar
    1862 posts

    Posted 30 Nov 2015 Link to this post

    Hello Manuel,

    This happens because there isn't a parent element to your element that has a fixed size. Height can be set in percentage only when there is a parent element with fixed size in the DOM. You can consider using a flexbox layout to arrange the elements in your view:
    A Complete Guide to Flexbox


    Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

Back to Top