title: alternative to wp_is_mobile()
body: <p>I would like to show a different image depending on whether you are on mobile or desktop.
  I figured I could do this with the wp_is_mobile function, but Wordpress says it should not be used for styling purposes.</p>
  
  <p>Real-life testing also shows that indeed it does not always work, and sometimes the desktop images is showed on mobile devices. My current code below. Where the div refers to a css class where I load the image.</p>
  
  <p>I initially used @media only screen and (max-width) in my css, but then it always loads both images. What would you recommend doing as the best solution?</p>
  
  <pre><code>&lt;?php if ( wp_is_mobile() ) : ?&gt;
      &lt;div id="webwinkelkeur-mobile"&gt;&lt;/div&gt;
  &lt;?php else : ?&gt;
      &lt;div id="webwinkelkeur-desktop"&gt;&lt;/div&gt;
  &lt;?php endif; ?&gt;&lt;/a&gt;
  </code></pre>
  
  <p>css part to load image from sprite</p>
  
  <pre><code>#webwinkelkeur-desktop{
      position:fixed;
      right:0px;
      top:45%;
      z-index:999;
      width:50px;
      height:100px;
      background: url('/webwinkelkeur-sprite.png') 0 0;
  }
  #webwinkelkeur-mobile{
      position:fixed;
      bottom:0px;
      z-index:999;
      width:80px;
      height:40px;
      background: url('/webwinkelkeur-sprite.png') 80px 40px;
  }
  </code></pre>