Ogled vira Predloga:DIY-kartica/en

<div
  style="
    background:#DBDBAB;
    border-radius:10px;
    overflow:hidden;
    box-shadow:0 4px 5px rgba(0,0,0,0.1);
    transition:transform 0.2s ease, box-shadow 0.2s ease;
    display:flex;
    flex-direction:column;
  "
  onmouseover="this.style.transform='translateY(-4px)'; this.style.boxShadow='0 8px 12px rgba(0,0,0,0.15)'"
  onmouseout="this.style.transform='translateY(0)'; this.style.boxShadow='0 4px 5px rgba(0,0,0,0.1)'"
>

  <!-- TITLE -->
  <div
    style="
      padding:0.1rem 0.2rem;
      text-align:center;
      font-weight:600;
      font-size:1.1rem;
      color:#2c3e50;
      line-height:1.2;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    "
  >
[[{{{title1|Example}}}|{{{display1|{{{title|Example}}}}}}]]
  </div>

  <!-- IMAGE -->
  <div
    style="
      height:180px;
      display:flex;
      align-items:center;
      justify-content:center;
      background:#fff;
      padding:0.3rem;
      overflow:hidden;
    "
  >
    <div style="max-width:100%; max-height:100%;">
      [[File:{{{image1|Example.jpg}}}|center|frameless|upright=1|link={{{title|Example}}}]]
    </div>
  </div>

</div>