Responsive Resizing of Promoted Links

Responsive Promoted Links App Part

So, previously I wrote about changing the look and feel of the SharePoint Promoted Links app. ┬áIf you have modified your promoted links as listed in this article, you’ll see something like this:

Maximized window view:

The problem is that if you resize the window, your tiles get cut off– not a big deal if you have a large enough monitor, but if you’re on a tablet, you’ll lose some links on the page.

Resized window with tiles cut-off:


If you modify the max-width property, and set the width to auto, you get a nice little responsive design-like feel and behavior out of the promoted links.

All tiles shown with resized window:

Here’s the specific code I’m talking about:

.ms-promlink-body {
height: 200px;
width: auto;


Go here for the full source code of the promoted links modifications.