테이블 셀 안의 수직 간격

Question

현재는 text-align: justify을 시뮬레이션하려고하지만 현재는 div와 div 사이에 있습니다.

나는이 같은 td 내부 4 div 있습니다

<td> 
    <div></div> 
    <div></div> 
    <div></div> 
    <div></div> 
</td> 

을하지만 총 높이가 TD의 높이만큼 높지 않다, 그래서 그들은 모두가 중앙에 수직으로 스택. 정당화 된 콘텐츠처럼 그들 사이에 공간을 두는 방법이 있습니까?

Answer 1

좋아, 그래서 나는 내가 찾고 있던 것을 성취 할 수 있었다. 잠재적으로 동일한 문제가있는 사람들을 위해 여기에 게시하겠습니다.

은 기본적으로 당신은 당신의 그럴 및 TD100 %까지의 높이를 설정해야합니다.

다음 용기를 높이로 설정하십시오. 100 % 및 디스플레이 : 플렉스;, justify-content 공백 또는 공백 사이에 공백을 넣습니다. 플렉스 방향 : 열 div가 100 % 너비 일 필요가없는 경우를 잊지 마세요.

HTML

<td> 
    <div> 
    <div></div> 
    <div></div> 
    <div></div> 
    <div></div> 
    </div> 
</td> 

CSS 나는 TD의 높이가 무엇인지 디자인 타임에 알고에 의해 그 높이를 분할 할 수있는 방법이 없습니다 추측

tr,td{ 
    height: 100%; 
} 

td>div{ 
    width: 100%; 
    height: 100%; 
    padding: 5px; 
    display: -webkit-flex; 
    display: -moz-flex; 
    display: -ms-flex; 
    display: -o-flex; 
    display: flex; 
    justify-content: space-around; 
    flex-direction: column; 
}