table th, td width 틀어짐 질문이요.

안녕하세요.

vitualization table을 구현하고 있는데. 테이블 header의 th width, tbody의 td width가 오차가 있어서 질문 남깁니다.

table의 모든 컬럼 width는 '%'로 주었습니다. 

header의 width는 소수점이 제외한 정수로 너비가 잡히는 반면, tbody의 td width는 소수점이 포함된 실수로 너비가 잡혀서 헤더 컬럼과 바디 너비사이에 0.x의 오차가 생깁니다...

 

*추가로, tbody의 td에 소수점이 생겨서 테이블에 가로 스크롤이 생기는 경우가 생깁니다...

그리고..

맨처음 화면에 떴을 땐 th width, td width가 동일하게 나오는데, 브라우저창 너비를 조절하면

th %값, td%이 바뀌면서 td에 소수점이 생깁니다..

 

테이블 구조와, 테이블 너비 오차 이미지 첨부하겠습니다.

고수님들 답변 부탁드립니다.

테이블구조, width화면

 

페이지 싸이트:

https://codesandbox.io/s/infallible-sanne-tf525?file=/src/App.js

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
이미지 사진은 imgur에 업로드한 뒤 링크 걸어주세요.
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기