Adds wrapper around Widon’t breaking space

[kennethormandy]

This pull request adds a span around the   generated for stopping trailing words, similar to the .ord and .amp classes. This allows you to use the breaking space differently depending on the media query, for example:

.widont {
  display: inline-block; /* Ignore the breaking space */
  outline: 1px solid blue;
}

@media (min-width: 35em) {
  .widont {
    display: inline; /* Restore the breaking space at larger screen sizes */
    outline: 1px solid purple;
  }
}

This works really well for mobile first styling, where you only opt-into the feature at larger breakpoints. I don’t think individual trailing words were ever seen as a thing to be avoided 100% of the time—something you’ve already accounted for really well by scoping it to certain elements. This just goes one step further and allows you to decide whether or not widows should be avoided depending on the current line length or break point.

[ekalinin]

Thanks!