Link Image Icon Grid

Tags:

Description:

This is a grid layout that I use for displaying album art on my profile. Might be useful for other people. It fills available column space so it should also look fine on mobile.

Example:

<div class="iconGrid">
    
    <a href="https://sewerslvt.bandcamp.com/" target="_blank">
        <img alt="sewerslvt avatar" src="https://f4.bcbits.com/img/0025072663_21.jpg"/>
        <span>Sewerslvt</span>
    </a>
    <a href="https://goreshit.bandcamp.com/" target="_blank">
        <img alt="goreshit avatar" src="https://f4.bcbits.com/img/0014872378_21.jpg"/>
        <span>goreshit</span>
    </a>
</div>

also mostly made this as a test for uploading layouts lol

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by Cherry (https://layouts.spacehey.com/layout?id=3432) -->

<style>
 .iconGrid {
	  display: grid;
	  grid-template-columns: repeat(auto-fill, 3.5rem);
	  grid-gap: 0.4rem;
 }
 .iconGrid > a {
	  padding: 0.1rem;
	  text-decoration: none;
 }
 .iconGrid > a > img {
	  width: 100%;
	  height: auto;
	  display: block;
	  border: white 1px solid;
 }
 .iconGrid > a > span {
	  display: block;
	  text-align: center;
	  font-size: 0.6rem;
 }
</style>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.

Comments

Displaying 20 of 30 comments ( View all | Add Comment )

Rehtea52	1784343349 using Report Comment
hospitalrabbit	1783453587 using Report Comment
milo ִ ࣪𖤐	1782794922 using Report Comment
liebessp1el	1781875565 Ya no anda creo Report Comment
proxies	1781655571 using Report Comment
HugSlut	1769913546 using!!! This is peak Report Comment
krika✮kira	1769359180 using cz ts so kewl !!!!!! Report Comment
Cupcakekiller	1767656838 use Report Comment
CAS!!! ^_^	1763105395 Using!!! Report Comment
H3artkizyy	1754645590 Using! Report Comment
H3artkizyy	1754645590 Using! Report Comment
𝑴𝒂𝒏𝒕𝒊𝒔	1741116530 using Report Comment
Xa	1739965929 Using! Report Comment
Tyler	1739634448 usinhhhh Report Comment
R^ttle.H34D!	1739423487 using xdddd Report Comment
⋆˚｡⋆୨✧୧˚ 𝒂𝑨𝒎𝒆𝒕_𝒉𝒚𝒔𝒕 ˚୨✧୧⋆｡˚⋆	1732337709 and how i can remove one of them :d Report Comment is not working for me .-. by ⋆˚｡⋆୨✧୧˚ 𝒂𝑨𝒎𝒆𝒕_𝒉𝒚𝒔𝒕 ˚୨✧୧⋆｡˚⋆; 1732338068; Report
chel-c	1728308091 dk if u will even see this but i cannot for the life of me figure out how this code works 3 Report Comment thank you <3333 by chel-c; 1728356638; Report Nah , i didn't understand too , even with your explanation . Its in those moment that i realize how stupid i am fr by Ali-Gris; 1730836007; Report 17 days ago... i was thiking abt leave a comment about how rmve one of them °3° by ⋆˚｡⋆୨✧୧˚ 𝒂𝑨𝒎𝒆𝒕_𝒉𝒚𝒔𝒕 ˚୨✧୧⋆｡˚⋆; 1732337661; Report
jia <3	1725227446 using! Report Comment