<p>a와 c의 기준선을 정렬하고 싶습니다. </p> <p><br /></p> <pre class="brush:css;toolbar:false;">#grid{ 표시:격자; 그리드 템플릿 열: 1fr 1fr; 항목 정렬: 기준선; } #ㅏ{ 그리드 행: 1 / 범위 2; 그리드 열: 1; 패딩: 8px; 배경: 빨간색; } #비{ 그리드 행: 1; 그리드 열: 2; 배경: 노란색; } #씨{ 그리드 행: 2; 그리드 열: 2; 배경: 파란색; }</pre> <pre class="brush:html;toolbar:false;"><div id="grid"> <div id="a">aaaaa</div> <div id="b">bbbbb</div> <div id="c">ccccc</div> </div></pre> <p><br /></p> <p>외부 그리드를 한 줄로 설정하고 inline-whatever 속성을 사용하여 div에서 b와 c를 래핑하려고 시도했지만 a는 여전히 항상 c 대신 b와 정렬됩니다. </p> <p><br /></p> <pre class="brush:css;toolbar:false;">#grid{ 표시:격자; 그리드 템플릿 열: 1fr 1fr; 항목 정렬: 기준선; } #ㅏ{ 그리드 행: 1; 그리드 열: 1; 패딩:8px; 배경:빨간색; } #디{ 디스플레이:인라인 블록; 그리드 행: 1; 그리드 열: 2; } #비{ 배경:노란색; } #씨{ 배경: 파란색 }</pre> <pre class="brush:html;toolbar:false;"><div id="grid"> <div id="a">aaaaa</div> <div id="d"> <div id="b">bbbbb</div> <div id="c">ccccc</div> </div> </div></pre> <p><br /></p> <p>a와 c를 기준선에 맞춰 정렬하는 방법은 무엇입니까? </p>