title: html/css: use image-set to have a portrait or landscape image as background-image for a div
body: <p>I'm trying to have a bootstrap 4 carousel use a landscape or portrait image as background for an item depending on the device orientation ...</p>
  <p>following simplified code works somehow (with some style in the head) but I cannot find info on <code>image-set</code> so I do not know how to substitute <code>1x</code> and <code>2x</code> with <code>landscape</code> and <code>portrait</code> (or if that can be done):</p>
  <pre><code>&lt;div class=&quot;container&quot;&gt;
    &lt;div class=&quot;outer&quot;&gt;
      &lt;div class=&quot;inner&quot;
           style=&quot;background-image: url('landscape.jpg');
                  background-image: -webkit-image-set(
                    url('landscape.jpg') 1x,
                    url('portrait.jpg') 2x);
                  background-image: -image-set(
                    url('landscape.jpg') 1x,
                    url('portrait.jpg') 2x)&quot;&gt;
        test
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p>did someone get something like this to work, or does someone have a better approach ?</p>