Eredmény: 1 - 7 (7) összesen

Téma: Képek egymás mellé, hogyan?

  1. #1
    Barát ariel logója
    Csatlakozott
    07-07-13
    Hely
    Budapest
    Hozzászólás
    882
    Begyűjtött 114 köszönetet
    80 hozzászólásával

    Alapbeállítás Képek egymás mellé, hogyan?

    Help...
    A következőt dolgot szeretném megoldani egy WP oldalam bejegyzésében:
    3 darab kép kerüljön egymás mellé, mondjuk 120x120 méretben, közepére rendezve.
    A képek egy-egy külső oldalra hivatkozzanak, és mind ez mobilon se törjön el.
    Lehetőleg valami html megoldásra van szükség, mert a CSS-ben nem vagyok otthon.
    Minden segítségest megköszönök.


    Utoljára módosítva: ariel által : 2020-05-16 07:56

  2. #2
    Szerkesztő
    Csatlakozott
    12-12-07
    Hozzászólás
    263
    Begyűjtött 119 köszönetet
    96 hozzászólásával

    Alapbeállítás re: Képek egymás mellé, hogyan?

    HTML kód:
    <div style="display:flex;justify-content:center;">
      <a href="">
        <img src="https://via.placeholder.com/120" alt="" />
      </a>
      <a href="">
        <img src="https://via.placeholder.com/120" alt="" style="margin:0 5px;" />
      </a>
      <a href="">
        <img src="https://via.placeholder.com/120" alt="" />
      </a>
    </div>



    Utoljára módosítva: apacska által : 2020-05-16 10:02

  3. Az alábbi felhasználók hálásak a válaszért:

    ariel (2020-05-16)

  4. #3
    Barát ariel logója
    Csatlakozott
    07-07-13
    Hely
    Budapest
    Hozzászólás
    882
    Begyűjtött 114 köszönetet
    80 hozzászólásával

    Alapbeállítás re: Képek egymás mellé, hogyan?

    Húúú, nagyon köszönöm, már majdnem tökéletes, de a képek között képe egy pár pixel szünet, mert egybe csúsztak.



  5. #4
    Barát ariel logója
    Csatlakozott
    07-07-13
    Hely
    Budapest
    Hozzászólás
    882
    Begyűjtött 114 köszönetet
    80 hozzászólásával

    Alapbeállítás re: Képek egymás mellé, hogyan?



    Ezen kód mellett:

    <div style="display:flex;justify-content:center;">
    <a href="valami.hu">
    <img style="border: 1px solid #cccccc!important; padding: 4px!important;" src="budapest.png" alt="valami" width="150 />
    </a>
    <a href="valami.hu">
    <img style="border: 1px solid #cccccc!important; padding: 4px!important;" src="budapest.png" alt="valami" width="150 style="margin:0 5px;" />
    </a>
    <a href="valami.hu">
    <img style="border: 1px solid #cccccc!important; padding: 4px!important;" src="budapest.png" alt="valami" width="150" />
    </a>
    </div>



  6. #5
    Szerkesztő
    Csatlakozott
    12-12-07
    Hozzászólás
    263
    Begyűjtött 119 köszönetet
    96 hozzászólásával

    Alapbeállítás re: Képek egymás mellé, hogyan?

    Elfelejtetted az idézőjeleket bezárni a width után.

    HTML kód:
    <div style="display:flex;justify-content:center;">
      <a href="valami.hu">
        <img style="border: 1px solid #cccccc!important; padding: 4px!important;" src="https://via.placeholder.com/150" alt="valami" width="150" />
      </a>
      <a href="valami.hu" style="margin:0 5px;">
        <img style="border: 1px solid #cccccc!important; padding: 4px!important;" src="https://via.placeholder.com/150" alt="valami" width="150" />
      </a>
      <a href="valami.hu">
        <img style="border: 1px solid #cccccc!important; padding: 4px!important;" src="https://via.placeholder.com/150" alt="valami" width="150" />
      </a>
    </div>




  7. #6
    Szerkesztő
    Csatlakozott
    12-12-07
    Hozzászólás
    263
    Begyűjtött 119 köszönetet
    96 hozzászólásával

    Alapbeállítás re: Képek egymás mellé, hogyan?

    Elfelejtetted az idézőjeleket bezárni a width után.

    HTML kód:
    <div style="display:flex;justify-content:center;">
      <a href="valami.hu">
        <img style="border: 1px solid #cccccc!important; padding: 4px!important;" src="budapest.png" alt="valami" width="150" />
      </a>
      <a href="valami.hu" style="margin:0 5px;">
        <img style="border: 1px solid #cccccc!important; padding: 4px!important;" src="budapest.png" alt="valami" width="150" />
      </a>
      <a href="valami.hu">
        <img style="border: 1px solid #cccccc!important; padding: 4px!important;" src="budapest.png" alt="valami" width="150" />
      </a>
    </div>




  8. Az alábbi felhasználók hálásak a válaszért:

    ariel (2020-05-16)

  9. #7
    Barát ariel logója
    Csatlakozott
    07-07-13
    Hely
    Budapest
    Hozzászólás
    882
    Begyűjtött 114 köszönetet
    80 hozzászólásával

    Alapbeállítás re: Képek egymás mellé, hogyan?

    Még egyszer nagyon szépen köszönöm, tökéletes!



Könyvjelzők

Hozzászólás szabályai

  • Új témákat nem hozhatsz létre
  • Válaszokat nem küldhetsz
  • Fájlokat nem csatolhatsz
  • A hozzászólásaidat nem módosíthatod
  •