Бюллетень отзывчивого фонда

Я работаю над информационным бюллетенем с Фондом, я хочу наложить два изображения на свой информационный бюллетень и сделать отзывчивым также.

Если вы можете объяснить мне метод сделать абсолютную позицию без позиции: абсолютная;

https://i.gyazo.com/eab7870f79887b985db09c16b67e3df2.png Для примера, img щелкните по мне на большом изображении.

<columns>
  <center>
    <img src="http://narty.fr/demo/about/assets/img/MUSELETTER_TYPOGRAPHIE.png" class="logo-bis"/>
    <row>
        <columns large="4" class="text-center">
          <th class="text-center marge"><a class="external-link" target="_blank" href="www.elsamuse.com">Blog</a></th>
        </columns>
        <columns large="4" class="text-center">
          <th class="text-center marge"><a class="external-link" target="_blank" href="https://www.instagram.com/studiomumuse/">Studio Mumuse</a></th>
        </columns>
        <columns large="4" class="text-center">
          <th class="text-center marge"><a class="external-link" target="_blank" href="https://www.elsamuse.com/box/shop/">Elsa Shop</a></th>
        </columns>
    </row>
    <div class="rela">
      <a href="https://www.jeanlouis26.com/">
        <img src="http://narty.fr/demo/about/assets/img/JL_ELSA.png">
        <span style="max-height:1px; float:left;" ><img src="http://narty.fr/demo/about/assets/img/clickme.png" class="click-3"></span>
      </a>
    </div>
  </center>
  <row>
    <columns class="rela" large="5">
      <a href="https://studiomumuse.premiere-classe.com/">         
        <img src="http://narty.fr/demo/about/assets/img/MEDLAY.gif" class="medley">
        <img src="http://narty.fr/demo/about/assets/img/clickme.png" class="click-2">
      </a> 
    </columns>
    <columns class="rela" large="6">
      <a href="http://www.elsamuse.com/2018/03/diy-la-veste-comics-facon-prada-pe2018/">
        <img src="http://narty.fr/demo/about/assets/img/JL_ELSA_1.png">
        <img src="http://narty.fr/demo/about/assets/img/TUTO.png" class="click-2">
      </a>
    </columns>
  </row>

  <row>
    <columns large="12">
      <img src="http://narty.fr/demo/about/assets/img/MUSELETTER_TEXTE.png"/>
    </columns>
  </row>
  <row>

И CSS:

.rela {
    position: relative;
}

.click-3{
    position: inline-block;
    z-index: 10;
    width: 11%!important;
}

.click-1{
   position: inline-block;
   z-index: 10;
   width: 15%!important;
}

.click-2 {
   position: inline-block;
   z-index: 10;
  width: 15%!important;
}

С Уважением,

0 ответов

Другие вопросы по тегам