I used the styled-components component, and I want to display a button next to it when the Input gets the focus, but it doesn’t work

Question

This is my code, can some one help me

I used the styled-components component, and I want to display a button next to it when the Input gets the focus, but it doesn't work.

Answer 1

I think changing InputContainer's type to input is good option...

const InputContainer = styled.input`
  ...
  &:focus + ${CancelButton} {
    display: block;
  }
`