디스플레이로 사용 가능한 공간 채우기 :

수동 너비를 지정하지 않고 두 번째 div를 사용하여 부모 div의 사용 가능한 공간을 차지할 수 있습니까?디스플레이로 사용 가능한 공간 채우기 :

시도해 본 데모는 Fiddle입니다.

.right_cnt { 
    display: table-cell; 
    background:#FFC; 
}

참고 : 내가 바로 사용할 공간을 차지하기 위해 노란색 상자가 필요합니다.

출처

2013-02-27 Sowmya

이 보이는, 그리고 당신이 maunually 지정한처럼 폭을 보이지 않는 어디 – Danield

이 당신이 필요로하는 것입니다 : HTTP ://jsfiddle.net/JqHXJ/3/ 또는 이것 : http://jsfiddle.net/JqHXJ/4/ 또는 이것 : http://jsfiddle.net/JqHXJ/5/ – Pandian

부모 요소에 display:table; width: 100%;을 설정하고 형제에서 float: left을 제거하십시오. http://jsfiddle.net/byNpM/2/

출처

2013-02-27 09:14:42 Tetaxa

나는 어떤 차이점을 찾지 못했습니다. 사용할 수있는 오른쪽 부분을 차지하기 위해 노란색 상자가 필요합니다 – Sowmya

죄송합니다. http://jsfiddle.net/byNpM/2/ – Tetaxa

멋지다. – Sowmya

테이블 레이아웃을 사용하여이를 구현할 수도 있지만, 반드시 가장 쉬운 방법은 아닙니다 : forked your fiddle to demonstrate.

쉬운 방법은 두 번째 셀을 수정하여 모든 표 표시 속성을 제거하고 두 번째 요소의 overflow을 hidden : another fork demonstrating this으로 설정하는 것입니다. zoom: 1은 이전 IE에서 작동하는 기술을 허용합니다. overflow

출처

2013-02-27 09:19:34 Barney

"당신의 바이올린을 F습니다"... –

This post의 부작용이 귀하가 찾고있는 것에 도움이 될 수 있다면 귀하의 목적에 따라 더 간단 할 수 있습니다. Xanthir's answer에서 특정 찾는

이에 대한 해결책은 아니지만 전혀 명백한 사실 매우 간단합니다. 특정 방법으로 float와 상호 작용하는 "블록 서식 지정 컨텍스트"라는 것을 트리거해야합니다 ( ). ... ...

출처

2013-02-27 09:24:58 Danield

그것은 더 width와 행의 마지막 사업부에 display:table-cell 동안은 포함하는 부모에게 display:table 사업부를 채우기 위해 스트레칭의 원인이됩니다, 나에게 나타납니다, 테이블 셀은 암시 적있다 'min-width'비헤이비어는 끌 수 없으므로 강제로 자식의 너비가됩니다.

100 % 너비의 오른쪽 셀에 넓은 패딩 상단에 왼쪽 셀을 절대 위치 지정해야했습니다. 이를 통해 100 % 너비의 내부 div는 창이 축소되고 내용이 스크롤 될 때 필요에 따라 축소됩니다. 이미 오른쪽에 avaiable이다 공간을 차지처럼 바이올린에서

http://jsfiddle.net/kmbro/cqkzbc4a/

출처

2016-11-08 22:02:41 kbro

Danfield의 대답을 읽었어야합니다. float : 왼쪽 div에 남겨두고 오버플로 : 오른쪽에 자동이 트릭을 수행합니다! 바이올린을 보여주기 위해 업데이트되었습니다. – kbro

디스플레이로 사용 가능한 공간 채우기 :

답변

관련 문제