너비가 고정되고 최대 너비가 90%인 그리드 하위 항목이 그리드 트랙을 오버플로하는 이유는 무엇입니까?

Question

질문:

내 질문은 매우 간단합니다. .header 요소가 뷰포트 너비 1500픽셀에 도달할 때 그리드 트랙을 오버플로하는 이유를 알고 싶습니다.

코드: 으아악 으아악

내가 원하는 효과:

내 생각은 .header元素的宽度为1500像素。当空间不足时，.header 요소의 너비를 1500픽셀로 만드는 것입니다. 공간이 부족하면

는 그리드 트랙의 90%를 차지해야 합니다.

내가 시도한 것:

width: min(1500px, 90%)并在.header元素中删除max-width，成功实现了这个效果，但我不知道具体发生了什么。我猜测网格轨道是根据内容的宽度来计算其宽度的。目前我不太确定1fr

요소에서 width: min(1500px, 90%)를 설정하고 max-width를 삭제하여 이 효과를 성공적으로 달성했지만 무슨 일이 일어났는지 정확히 모르겠습니다. 무엇. 나는 그리드 트랙이 콘텐츠의 너비를 기준으로 너비를 계산한다고 추측합니다. 현재로서는 1fr이 정확히 무엇을 의미하는지 잘 모르겠습니다.

내 생각:

모두들 Grid가 좋다고 하는데 저는 Flexbox의 따뜻함을 떠나면 항상 고민에 빠지곤 합니다. 🎜

Answer 1

사용 90vw而不是90%이 효과가 있는 것 같습니다

으아악 으아악