title: Padding of swiper slide image
body: <p>I have a fullscreen swiper which contains a bunch of images as slides like this:</p>
  <pre><code>    &lt;div class=&quot;swiper-slide&quot;&gt;&lt;div class=&quot;swiper-image&quot;&gt;&lt;img src=&quot;...&quot;&gt;&lt;/div&gt;&lt;/div&gt;
  </code></pre>
  <p>With this setup (standard swiper css) the images are max full width and full height.
  I would like to give the image a padding so that the pagination and the arrows never overlap the image. This works for the width (and for top if not swiper-slide == flex) but not for the height.</p>
  <p>I'm not sure why the padding for the height gets eaten up / has no effect? the height doesn't scale the image.</p>
  <p><a href="https://jsfiddle.net/pvw8ay64/" rel="nofollow noreferrer">jsfiddle example</a></p>