绝对位置的元素始终显示在手机视图的底部

Question

我的元素具有预定义的位置top和left，并且我试图在视图中将它们添加到适当的位置但是当我在手机上测试时，它们总是出现在视图的底部。我使用Chrome调试器对其进行了测试，它可以作为魅力而不是我的智能手机。

＆＃13;

＆＃13;

.device-list-item1{
    overflow: auto;
    white-space: nowrap;
    display: inline-block;
    margin: 10px;
 }
 .button1{
    min-height: 50px;
    min-width: 50px;
    padding: 20px 5px;
    text-align: left;
    border: 1px solid $color-light-grey;
    box-shadow: 0px 0px 3px $color-light-grey;
    border-radius: 3px;
    color: $color-se-logo-green;
    max-height: 100px;
    background: $color-white;
    font-size: 14px;
    .device-icon {
      display: inline-block;
      vertical-align: middle;
      background-size: contain;
      background-repeat: no-repeat;
      background-image: url("./img/DeviceIcon.png");
      color: $color-se-logo-green;
      height: 30px;
      width: 30px;
    }
    .dashboard-device-container {
      display: table;
      >div {
        display: table-cell;
      }
      >span {
    display: block;
      }
      > div.icons {
        white-space: nowrap;
      }
      > div.name {
        width: 99%;
        line-height: 20px;
        vertical-align: middle;
      }
    }
  }

＆＃13;

    <div id="device-list-item1" class="device-list-item1" ng-repeat="item in vm.fact_bases" ng-model='vm.fact_bases'>
  <div class="button1 canvas-element canvas-element1" id="{{item.id}}" alert="{{item.alert}}" idFactory="{{item.factory}}" ng-click="deviceSelected(item.id)" ui-sref="app.dashboard.details({transmitterId: item.id, transmitterName: item.id})" style="position: absolute; left: {{item.posx}}px; top: {{item.posy}}px;">
    <div class="dashboard-device-container">
      <div class="icons"><i class="device-icon"></i></div>
      <span class="device_description" ng-bind="item.uiDescription"></span>
      <span class="deviceid" ng-bind="item.id"></span>
      <div class="icons" ng-if="item.alert"><i class="exlhoist-alarm-error-icon"></i></div>
    </div>
  </div>

＆＃13;

＆＃13;

＆＃13;