Ogled vira Predloga:Material-kartica

<div style="
  background:#E0E6EE;
  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)'"
>

<!-- NASLOV -->
<div style="
  padding:0.1rem 0.1rem;
  text-align:center;
  font-weight:600;
  font-size:1rem;
  color:#0081ED;
  line-height:1.2;
  white-space:normal;
  overflow-wrap:break-word;
  word-break:break-word;">
[[{{{title1|Example title 1}}}|{{{display1|{{{title1|Example title 1}}}}}}]]
</div>

<!-- SPODNJI DEL -->
<div style="flex:1; display:flex;">

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

  <!-- PODATKI -->
  <div style="
    flex:1;
    padding:0.6rem;
    color:#0081ED;
    font-size:0.75rem;
    line-height:1.2;">

● <b>KATEGORIJA:</b> {{{kategorija1|Kategorija}}}<br>
● <b>LOKACIJA:</b> {{{lokacija1|Lokacija}}}<br>
● <b>INV. ŠT.:</b> {{{inv1|Številka}}}<br><br>
{{{info1|Tukaj pride opis ali podatki}}}<br>

  </div>

</div>

</div>