Ionic: --livereload changes styling


#1

I have this view, which is meant to display a map with semi-transparent bars at the top and bottom. As you can see, it works on Android, but the styling is inconsistent across platforms. On iOS, the banner is not directly at the top, and appears to be clearing the header twice. Using livereload actually fixes the issue for some reason and I’m not sure why.

<ion-content scroll="false" data-tap-disabled="true">
<div class="bar bar-subheader" style="background: rgba(20 , 54, 92, 0.6)">
    <span style="color:white" class="title">
        {{address.streetAddress}}
    </span>
</div>

<div style="height:100%;" data-tap-disabled="true">
    <div id="map" style="width: 100%; height: 100%">
    </div>
</div>

<div class="bar bar-footer" style="background: rgba(20 , 54, 92, 0.6)">
    <span style="color:white" class="title">
        {{movingMessage}}
    </span>
</div>