Styling promoted links web part

Question

I have a promoted links web part with 12 items. I would like to show the tiles in a 4x3 grid for which I'm using code.

Though I'm able to make changes to the UI, the tiles appear very close to each other. I would like to know if there any option to increase the space / padding between each tile?

Thank you

Answer 1

This depends on the width of tile-root, tile-content

<style>
div.ms-tileview-tile-root {
width: 185px !important;
}

div.ms-tileview-tile-content
{
   width: 180px !important;
}
</style>

This will keep a 5px border around the tile, if its width 185px

---

Note: the CSS style working only with the custom promoted list, not to the default prompted list like "Get Started with your Web Site" that created at a new site.