diff --git a/src/frontend/components/Button/ButtonLayout/index.tsx b/src/frontend/components/Button/ButtonLayout/index.tsx
index 188f31b99a..795b6c6137 100644
--- a/src/frontend/components/Button/ButtonLayout/index.tsx
+++ b/src/frontend/components/Button/ButtonLayout/index.tsx
@@ -1,5 +1,5 @@
 import React, { useContext } from 'react';
-import { Box, Text, ResponsiveContext, Stack } from 'grommet';
+import { Box, Text, ResponsiveContext } from 'grommet';
 import styled from 'styled-components';
 
 import { SvgProps } from 'components/SVGIcons';
@@ -67,12 +67,10 @@ export const ButtonLayout = ({
   const rectColor = reversed ? tintColor : undefined;
 
   return (
-    <Box align="center" fill>
+    <Box align="center" flex height="100%">
       {Icon && (
-        <Stack anchor="bottom-right" fill>
-          <IconBox screenSize={size}>
-            <Icon focusColor={rectColor} height="100%" iconColor={iconColor} />
-          </IconBox>
+        <IconBox screenSize={size}>
+          <Icon iconColor={iconColor} focusColor={rectColor} height="100%" />
           {badge && (
             <Box
               align="center"
@@ -83,13 +81,14 @@ export const ButtonLayout = ({
               }}
               pad={{ horizontal: '3px', vertical: '1px' }}
               round="6px"
+              style={{ position: 'absolute', bottom: '0px', right: '0px' }}
             >
               <StyledTextBadge color={tintColor} size="0.688rem">
                 {badge}
               </StyledTextBadge>
             </Box>
           )}
-        </Stack>
+        </IconBox>
       )}
 
       {label && (