가운데 표 셀을 내용 너비로 조정하십시오.

Question

목표는 중간 표 셀의 내부 내용에 따라 너비를 조정하는 것입니다.

나는 테이블 셀에서 다음을 사용하여 끝낼 수 있음을 알고 있습니다. 너비 : 1px; white-space : nowrap;

그러나 중간 테이블 셀에서는이를 수행 할 수 없습니다. 어떤 제안이라도 대단히 감사하겠습니다.

참고 : 저는 이것이 flexbox에서 얼마나 쉬운 지 알고 Flexbox 솔루션을 찾고 있지 않습니다.

아래 이미지는 참조 용입니다.

Answer 1

당신은 중심 셀에 대해 테이블 ​​셀 및 사용 1 픽셀의 폭을 사용해야합니다. 당신은 패딩이 필요하면

.table{ display: table; width: 100%;} 
 
.left,.right,.center{display: table-cell; width: auto;} 
 
.left{ background-color: gray;} 
 
.right{ background-color: silver; text-align: right;} 
 
.center{ background-color: black; color: white; width: 1px;}

<div class="table"> 
 
    \t \t <div class="left">Content Left</div><div class="center">Content Center</div><div class="right">Content Right</div> 
 
</div>

, 그냥 왼쪽, 오른쪽과 중앙 DIV 내부에 내부 사업부를 사용 : 왼쪽과 오른쪽 셀 너비 자동해야합니다.