[CSS] div내 input 포커스 시, div 테두리 focus주기

 

 

/* 초기에는 div의 border를 숨김 */
.a {
    border: 2px solid transparent;
    transition: border 0.3s; 
}


/* input 요소나 input의 포커스 가능한 자식 요소가 focus를 받았을 때, div의 border 스타일을 변경 */
.a:focus-within {
    border-color: blue;
}

 

 

만약 그림자를 주고 싶다면 아래 블로그 참고

https://zxchsr.tistory.com/301

[CSS] input text focus border color, 포커스 시 테두리 색상 변경