hello! this is a free to use code, so do what you like with it! sorry I didn't get to you sooner; I don't check this account very often so it's better if you hit me up on my main account. here's a modified version of the polaroid code with links and text added. feel free to tweak further: 'transform: rotate()' is what makes the elements do the wobble thing, so you might want to set it to different values for each separate polaroid to keep the offset look. or remove it altogether, if you want to put them back in alignment! anyway:
architeuthid_codes
[FTU] Thumbtack
hello! this is a free to use code, so do what you like with it! sorry I didn't get to you sooner; I don't check this account very often so it's better if you hit me up on my main account. here's a modified version of the polaroid code with links and text added. feel free to tweak further: 'transform: rotate()' is what makes the elements do the wobble thing, so you might want to set it to different values for each separate polaroid to keep the offset look. or remove it altogether, if you want to put them back in alignment! anyway:
<!-- START POLAROID -->
<a href="URL GOES HERE">
<div class="card" style="border-radius: 5px; border: 5px solid white; width: 150px; height: 190px; background: white; transform: rotate(-3deg); margin: 10px; box-shadow: -2px 4px 10px rgba(0,0,0,0.5);">
<div style="width: 100%; height: 80%; background: url(IMAGE URL GOES HERE) center center; background-size: cover; border-radius: 5px; z-index: 2; text-align: center;">
<i class="fa fa-thumbtack text-body" style="transform: rotate(3deg); position: absolute; z-index: 10; top: -15%; font-size: 200%; text-shadow: 2px 4px 5px rgba(0,0,0,0.5);"></i>
</div>
<div style="text-align: center; color: black;">text goes here</div>
</div>
</a>
<!-- END POLAROID -->
2 years, 9 months ago Edited 1:36 pm
Yoooo Tysm!!
2 years, 9 months ago