Media library grid item label sticks out, media alignment should adhere to positioning standards

Issue summary updated as of comment #14

Problem/Motivation

1. In Claros's media-grid the item's name sticks out of its expected place if the name of the media is shorter than width of the individual grid block. It exceeds both on the top and the bottom of the name space.
2. Also, the uploaded media does not adhere to the standardised design, and floats above the media name space instead of being stuck to it.

Steps to reproduce

1. Enable Media and Media Library modules.
2. Goto /admin/content/media-grid
3. Add media with short filename

Proposed resolution

1. .media-library-item__attributes should be shrunk to address the media name space bleeding into either ends of the Y axis.
2. Media element should be aligned to the top of its name space.

BEFORE patch

AFTER patch