Make promoted links in SharePoint smaller

Promoted links.. I have a love/hate relation with them. On the one hand they are a cool way to visually show some quicklinks, on the other hand they take a lot of real estate..

I already covered how you can split it in multiple rows, now I found a great css (that I altered just a tiny bit) here that makes the tiles smaller (110px instead of 160px)

<style type="text/css">
div.ms-promlink-body {
height: 100px;
}

div.ms-tileview-tile-root {
height: 110px !important;
width: 110px !important;
}

div.ms-tileview-tile-content, div.ms-tileview-tile-detailsBox,  div.ms-tileview-tile-content > a > div > span {
height: 100px !important;
width: 100px !important;
}

div.ms-tileview-tile-content > a > div > img {
max-width: 100%;
width: 100% !important;
}

ul.ms-tileview-tile-detailsListMedium {
height: 100px;
padding: 0;
}

li.ms-tileview-tile-descriptionMedium {
font-size: 11px;
line-height: 16px;
}

div.ms-tileview-tile-titleTextMediumExpanded, div.ms-tileview-tile-titleTextLargeCollapsed, div.ms-tileview-tile-titleTextLargeExpanded {
padding: 3px;
}

div.ms-tileview-tile-titleTextMediumCollapsed {
background: none repeat scroll 0 0 #002E4F;
font-size: 12px;
line-height: 16px;
min-height: 36px;
min-width: 97px;
padding-left: 3px;
position: absolute;
top: -36px;
}

li.ms-tileview-tile-descriptionMedium {
font-size: 11px;
line-height: 14px;
padding: 3px;
}

.ms-promlink-header{
display:none;
}

</style>

As always, put the code in a “content editor webpart” on the page.