Slightly less hacky - using margin instead of a nonbreaking space

Author: MichaelArestad

src/components/Cardinal.stories.tsx

@@ -187,7 +187,7 @@ export const WithIcon = () => (
     count={14}
     TextWrapper={() => (
       <span>
-        Changes&nbsp;
+        Changes
         <Icon icon="question" aria-label="More info" />
       </span>
     )}

src/components/Cardinal.tsx

@@ -80,7 +80,7 @@ const CardinalInner = styled.div<CardinalInnerProps>`
   svg {
     width: 12px;
     height: 12px;
-    margin: 1px 0;
+    margin: 1px 0 0 4px;
     vertical-align: top;
     color: inherit;
   }