Adding an overflow to round card images. (#3556)

* Adding an overflow to round card images. * CL * Update CHANGELOG.md Co-authored-by: Caroline Horn <549577+cchaos@users.noreply.github.com> Co-authored-by: Caroline Horn <549577+cchaos@users.noreply.github.com>
elastic · Jun 4, 2020 · 4f60ee5 · 4f60ee5
1 parent 08d94fe
commit 4f60ee5
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 0 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,6 +4,7 @@
 
 **Bug fixes**
 
+- Fixed `EuiCard` image corners to be contained within border radius ([#3556](https://github.com/elastic/eui/pull/3556))
 - Fixed `EuiKeyPadMenu` and `EuiKeyPadMenuItem` aria roles ([#3502](https://github.com/elastic/eui/pull/3502))
 - Fixed `EuiFieldSearch` input clear button doesn't show when external input is passed([#3497](https://github.com/elastic/eui/pull/3497))
 - Fixed `EuiBasicTable` footers to always use a unique `key` ([#3559](https://github.com/elastic/eui/pull/3559))

diff --git a/src/components/card/_card.scss b/src/components/card/_card.scss
@@ -148,6 +148,7 @@
     // match border radius, minus 1px because it's inside a border
     border-top-left-radius: $euiBorderRadius - 1px;
     border-top-right-radius: $euiBorderRadius - 1px;
+    overflow: hidden;
 
     img {
       width: 100%;