CSS를 사용하여 상위 div 내에서 div를 수직 중앙에 배치하는 방법은 무엇입니까?

이 쿼리에서 사용자는 "로그인" 상위 div 내에서 "사용자 이름" 및 "양식" div를 수직으로 정렬하는 데 도움을 구합니다. 그들은 "vertical-align: middle;"을 사용하려고 시도했습니다. 속성이 성공하지 못했습니다.

솔루션

최신 브라우저에서 div를 세로로 중앙에 배치하는 최적의 솔루션은 Flexbox입니다.

#Login {
    display: flex;
    align-items: center;
}

Flexbox가 지원되는 경우 부족합니다(예: IE 9 이하). 이전 방법을 통한 대체 옵션은 다음과 같습니다. 필수입니다.

추가 리소스

• [Flexbox에 대한 브라우저 지원](https://caniuse.com/?search=flexbox)
• [안내 Flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
• [CSS 유연한 상자 사용](https://developer.mozilla.org/en -US/docs/Web/CSS/CSS_Flexible_Box_Layout/)

위 내용은 CSS를 사용하여 상위 div 내에서 div를 수직 중앙에 배치하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!