How to horizontally position button in MUI TextField immediately to the right of the text

233 Views Asked by At

I used the endAdornment prop to insert a button in a TextField. Even with position set to 'start', the button appears to the far right of the field. I want it to appear right next to the Text. I realize that I can place it immediately to the left of the Text using startAdornment. That is not what I want.

                <TextField 
                    value='Text'
                    InputProps={{ 
                        endAdornment: (
                            <InputAdornment position="start">
                            <IconButton>
                                <InfoOutlined />
                            </IconButton>
                            </InputAdornment>
                        )
                    }}
                />

I tried using display: 'flex', justifyContent: 'start', justifyItems: 'start', justifySelf: 'start'. None of these effected the alignment.

0

There are 0 best solutions below