score:1

try using the break word css property. read more here

<container maxwidth="md">    
<box sx={{ mt: 3, border:1}}>
    <box style={{width:'100%}}>
        {hassubmitted ?
            <div style={{width:'100%}}>
                <alert sx={{mt:3}} severity="success" style={{wordwrap:'break-word', width:'100%}}>
                {receiveddata}
                </alert>
            </div>
        : null}
    </box>
</box>
</container>

score:1

it's not recommended to use style prop, in order to customize the component alert use global class name or styleoverrides property, in your example i used global class name:

.muialert-message {
 min-width: 0;
 word-wrap: break-word;
}

check this: https://mui.com/api/alert/#css


Related Query

More Query from same tag