How to resize a material-ui button
You could add max/min width/height style options.
For instance:
<Button style={{maxWidth: '30px', maxHeight: '30px', minWidth: '30px', minHeight: '30px'}}/>In this case button always will look like a square and have a fix size (30px).
I assume you have a <Grid container> around the elements you posted. MUI Grids are designed to fill up the space and manage column widths. Seems like you probably need to restrict the outer <Grid container> to the total width you want the columns to span.
Also, note if you want to override all <Buttons>, do so in the theme...
createMuiTheme({ overrides: { MuiButton: { outlined: { borderRadius: '0' } } }})