fix(tag): set vertical alignment (#7927)

* fix(tag): set vertical alignment

* docs(Tag): add test story

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

Author: emyarod

packages/components/src/components/tag/_tag.scss

@@ -36,6 +36,7 @@
     min-height: rem(24px);
     margin: $carbon--spacing-02;
     padding: $carbon--spacing-02 $carbon--spacing-03;
+    vertical-align: middle;
     word-break: break-word;
     border-radius: rem(15px);
     cursor: default;

packages/react/src/components/Tag/Tag-story.js

@@ -94,6 +94,19 @@ _Default.parameters = {
   },
 };
 
+export const VerticalAlignment = () => (
+  <>
+    <Tag type="gray">Tag 1</Tag>
+    <Tag type="gray" renderIcon={Compass16}>
+      Tag 2
+    </Tag>
+    <Tag type="gray" filter>
+      Tag 3
+    </Tag>
+    <Tag type="gray">Tag 3</Tag>
+  </>
+);
+
 export const Filter = () => (
   <Tag className="some-class" {...props.filter()} filter>
     {text('Content (children)', 'This is a tag')}