CSS text-align

css text-align:center

는 일반 텍스트나 레이어로 감싸진 텍스트를 중앙정렬 할때 쓰는 속성
input 박스에다 text-align:center 속성을 주면 x

• input 박스를 중앙정렬 위해서는 div태그나 span태그로 input 박스를 한번 감싸고 text-align:center 속성을 주거나
• margin:0 auto;
  width:가로사이즈 를 감싼 div나 span태그에 줘야 중앙정렬 가능

    return (
        <LoginContainer>
            <FormContainer>
              <form onSubmit={handleSubmit(onClickLogin)}>
      //한번더 감싸주기
                <InputBox>
                    <h2>로그인</h2>
                    <InputBoxInner>
                      <input id='id' name='id' placeholder='ID' {...register('id')} />
                      <input id='password' name='password' type='password' placeholder='PASSWORD'/>
                      <button type='submit'>로그인</button>
                      <button>카카오 소셜 로그인</button>
                    </InputBoxInner>
                    <SignMove>아직 회원이 아니신가요?</SignMove>
                  </InputBox>
                </form>
            </FormContainer>
        </LoginContainer>
    )