Grid: Long words inside grid__item cause incorrect widths

[chuckhendo]

A long word inside of a grid__item causes the grid__item to be wider than it's flex-basis indicates it should be. One way to fix this seems to be:

1. Set width on grid__item to be the same as flex-basis
2. Set word-wrap: break-word
3. Find some way to hyphenate?

[Keale2]

I suspect any component with long words will break any component they are used in, so we may want to consider a solution that addresses more than grid__item.

We can consider hyphens: auto at a higher level.

[chuckhendo]

@Keale2 Agreed. I think 2 and 3 could potentially be handled at a higher level. 1 still needs to be completed on this component in order for those to work properly though