다른 CSS 코드가 무엇이든 관계없이 Flexbox의 텍스트를 수직 중앙에 강제로 배치할 수 있는 방법이 있나요?

Question

내가 개발 중인 웹사이트에 사용되는 더 큰 CSS 코드의 일부인 다음 CSS 코드가 있습니다.

으아악

내가 가지고 있는 HTML 코드에는:

으아악

하지만 텍스트 Text Sample 1 和 Text Sample 2는 수직 중앙에 있지 않고 Flexbox 상단에 있습니다. 내 큰 CSS 코드에 뭔가 방해가 되는 것 같지만 그게 무엇인지는 모르겠습니다. 내 질문은 우리가 CSS의 나머지 부분이 무엇인지 모른다고 가정하는 것입니다. 이 부분이 우리가 원하는 작업, 즉 flexbox의 텍스트를 수직으로 가운데에 배치하도록 강제할 수 있습니까?

Answer 1

이 문제는 .cards-u에 높이가 정의되어 있지 않기 때문에 발생합니다. 콘텐츠의 높이를 자체 높이로 사용하고 콘텐츠를 해당 영역 내에 유지합니다.

100vh를 사용하여 .cards-u에 전체 페이지 높이를 제공하거나 다음을 수행해야 합니다.

으아악