css table print page 버그...

와.. 이거 때문에 진짜로, 16시간 넘게 날려먹었다.
css table print 할때.

프린트 할때에. table 을 사용하는 사람들이 있다.

pdf 를 만들든 뭐든.

근데. 여기서 2페이지 이상 넘어가면, tr의 높이 크기값이 이상하리만큼 커지는 경우가 있다.

그 이유는. display: flex; 를 사용해서이다. table 안에서 div든 어디든 flex를 사용하면. 2page 넘어가는 인쇄영역에서. page가 넘어가는 끝 부분에서의 문제로 꼭 문제가 발생된다.

https://github.com/wkhtmltopdf/wkhtmltopdf/issues/1524#issuecomment-708958565

Hi guys. So whoever finds it banging his head against the wall trying to solve issues with page-break styles not working and header overlapping rows on the 2+ pages, here's what I found out:
At the root of my page, I had display: flex; container. It was exactly the reason why none of the previous answers worked for me.
@media print { display: block; } for that container worked like a charm in my case.
I'm fully aware, you might need display: flex for print version of your page. Just wanted to let you know that was the root cause of the problem.

해당 내용이다. 2페이지 이상되는 부분에서 문제가 생기는건 flex 일거라고 한다.
그래서 실제로 flex를 지워보니. 잘된다. 정말.. 이걸로 거진 16시간 넘게 잡아먹었다.

꼭 print 하는 영역에서는 사용하다보면 2page 이상 넘어가기 마련이고, 그렇기에 flex 사용은 절대로 금하는 것이 좋아보인다. 크기 값을 제대로 못받는거 같다.

css table print 2page+ 에서 발생하는 css 버그는 flex 사용의 결과이므로, flex가 아닌 다른 방법으로 css를 작성하자 !