CSS 그리드 자동으로 열이 나는 그리드를 정의하는 경우, 즉 것으로, CSS 그리드와 UI 작업을하고 있는데 약간 이상한 행동을보고 한

자동 영역의 내용을 그리드가 공간을 채우도록 강제 확장 할 경우, 문제는 사라질 것 같다. 그러나 필자가 보았던 모든 예와 이해는이 템플릿이 뷰포트 너비의 100 %까지 확장되어야 함을 의미합니다.

여기에 뭔가가 있습니까? 확실히 생각, 어떤 생각? 규칙에

grid-template-columns: 50px auto 50px

auto 값은 내용의 폭과 열 너비를 설정합니다. auto은 콘텐츠 기반을 의미합니다.

따라서 열의 너비는 행 너비와 관련이 없습니다.

50px + content width + 50px can be anything

당신은 열이 남아있는 모든 공간을 사용하는 두 번째 열을 알려줄 수있는 분수 단위를 사용하여 다음 행의 폭을 기입하십시오. 여기

grid-template-columns: 50px 1fr 50px

2017-12-12 19:55:19

답변