fix: get rid of nasty aspect ratio bug

1 files changed, 5 insertions, 4 deletions

diff --git a/src/components/Image/BackgroundImage.tsx b/src/components/Image/BackgroundImage.tsx
index e749d10..7d8e6e2 100644
--- a/src/components/Image/BackgroundImage.tsx
+++ b/src/components/Image/BackgroundImage.tsx
@@ -11,13 +11,14 @@ const useStyles = makeStyles({
   root: {
     position: 'absolute',
     width: '100%',
-    height: '100%'
+    height: '100%',
+    overflow: 'hidden'
   },
   image: {
     objectFit: 'cover',
     pointerEvents: 'none',
     width: '100%',
-    height: '100%'
+    minHeight: '100%'
   }
 });
 
@@ -25,9 +26,9 @@ const BackgroundImage: React.FC<PropTypes> = ({ src, alt }) => {
   const classes = useStyles();
 
   return (
-    <picture className={classes.root}>
+    <div className={classes.root}>
       <Image src={src} alt={alt} className={classes.image} />
-    </picture>
+    </div>
   );
 };