title: Absolute background on pseudo-element ::before on IE 11
body: <p>My problem is pretty weird. I have a background in a <code>container::before</code>, absolute-positioned and on every browser it works perfectly. </p>
  
  <p>On IE 11 when I first load my page, my background only takes the width of my container (both sides are not visible).  When I open my debugger or when I move the window the sides are revealed. </p>
  
  <p>I tried <a href="https://stackoverflow.com/questions/29368908/background-image-in-bodybefore-on-ie-not-working">this hack</a> but it doesn't work. </p>
  
  <pre><code>.connexion-layout {
      position: relative;
      overflow: hidden; 
  }
  .connexion-layout .container {
      padding-top: 200px;
      padding-bottom: 200px; 
  }
  
  .connexion-layout .container::before {
      content: " ";
      display: block;
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: 0;
      background: none no-repeat center center / cover; 
  }
  
  @media screen and (min-width: 980px) {
      .connexion-layout .container::before {
          background-image: url("../../theme/images/connexion-bg-desktop.jpg?1433411383"); 
      } 
  }
  @media screen and (max-width: 979px) {
      .connexion-layout .container::before {
          background-image: url("../../theme/images/connexion-bg-mobile.jpg?1433411383"); 
      } 
  }
  </code></pre>
  
  <p>Have you ever had something like this?</p>