title: Ionic FAB: Chrome Display Issue
body: <p>I'm using Ionic 3 and I have some <a href="https://ionicframework.com/docs/api/components/fab/FabButton/" rel="nofollow noreferrer">FAB Buttons</a> in use that appear over the header (<code>top edge</code>).  Very recently these stopped appearing above the header and now appear under it.  The symptom can be seen in the <a href="https://ionicframework.com/docs/api/components/fab/FabContainer/" rel="nofollow noreferrer">Ionic Docs</a> when viewing their demos.</p>
  
  <p>Anyone else seeing this issue?  Did Chrome make a change that adjusted how Z-Index is handled?  For reference, FAB's still look good in FireFox and iOS/Safari.</p>
  
  <p><strong>Update after more research</strong></p>
  
  <ul>
  <li>This seems to have started with Chrome 71</li>
  <li>An <a href="https://forum.ionicframework.com/t/ionic-fabs-ion-fab-under-header-since-chrome-71/150188" rel="nofollow noreferrer">Ionic Forums post</a> has some additional detail</li>
  <li>A <a href="https://github.com/ionic-team/ionic/issues/16780" rel="nofollow noreferrer">Github Issue</a> has been submitted to the Ionic team</li>
  </ul>
  
  <p>While there are some work-arounds, it seems like there isn't a solid explanation (and thus no solid long-term fix).</p>