From aee631c754352e2f21c0a5294daa5c36493e7999 Mon Sep 17 00:00:00 2001
From: John Kreitlow <863023+radium-v@users.noreply.github.com>
Date: Mon, 30 Nov 2020 13:30:16 -0800
Subject: [PATCH] Clamp select height to heightNumber (#4153)

- Fix select control padding
- Set select as border-box
---
 .../fast-components/src/select/select.styles.ts               | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/web-components/fast-components/src/select/select.styles.ts b/packages/web-components/fast-components/src/select/select.styles.ts
index 67b1bdc4c92..f87e3ad38c2 100644
--- a/packages/web-components/fast-components/src/select/select.styles.ts
+++ b/packages/web-components/fast-components/src/select/select.styles.ts
@@ -32,8 +32,10 @@ export const SelectStyles = css`
         background: ${neutralFillInputRestBehavior.var};
         border-radius: calc(var(--corner-radius) * 1px);
         border: calc(var(--outline-width) * 1px) solid ${accentFillRestBehavior.var};
+        box-sizing: border-box;
         color: ${neutralForegroundRestBehavior.var};
         contain: contents;
+        height: calc(${heightNumber} * 1px);
         position: relative;
         user-select: none;
         min-width: 250px;
@@ -69,7 +71,7 @@ export const SelectStyles = css`
         font: inherit;
         line-height: var(--type-ramp-base-line-height);
         min-height: calc(${heightNumber} * 1px);
-        padding: calc(var(--design-unit) * 2.25px);
+        padding: 0 calc(var(--design-unit) * 2.25px);
         width: 100%;
     }