Addon-controls: Fix ArgsTable bugs and styling

[domyen]

Issue: #11362, #11698

What I did

• Fixed width of ArgsTable columns when not compact
• Allow really long code strings to flow to the next line
• Prevent Boolean (true|false pill button) control from stacking when it's parent width is constrained
• Some code font-size tweaks
• Fix missing border style in Safari only Props table does not show border on Safari #11698

How to test

• Is this testable with Jest or Chromatic screenshots? Yes, look at Chromatic changeset here
• Does this need a new example in the kitchen sink apps? no
• Does this need an update to the documentation? no

[shilman]

LGTM. Only question is why we are hardcoding font size rather than inheriting from the parent element? This seems brittle and in the past we've had to fix it e.g. #11770

[domyen]

@shilman I acknowledge that setting absolute values negates the ability to set one font-size at the top level and have it get inherited everywhere. But relative units can make it tough to apply precise sizing and debug what the resultant font-size is. You end up with values like font-size: 92.8%; and font-size:85.7% to represent 13px and 12px respectively.

This came up in another issue with relative line-heights. I guess there's a tradeoff here.