[css] CSS 플로트를 한 줄로 유지하려면 어떻게합니까?

float: left왼쪽의 항목을 사용하여 동일한 줄에 두 개의 항목을 갖고 싶습니다 .

나는 이것을 혼자 달성하는 데 아무런 문제가 없습니다. 문제는 브라우저 크기를 매우 작게 조정하더라도 두 항목 이 같은 줄에 유지 되기를 원한다는 것 입니다. 아시다시피 … 테이블과 같은 방식입니다.

목표는 무엇을하든 오른쪽에있는 물품이 포장 되지 않도록하는 것 입니다.

CSS를 사용하여 브라우저에 랩을 감싸는 것보다 스트레칭하는div 방법을 알려 주면 어떻게 float: right;div가 아래에 float: left; div있습니까?

내가 원하는 것 :

                                   \
 +---------------+  +------------------------/
 | float: left;  |  | float: right;          \
 |               |  |                        /
 |               |  |content stretching      \   Screen Edge
 |               |  |the div off the screen  /  <---
 +---------------+  +------------------------\
                                             /

답변

.minwidth { min-width:100px; width: auto !important; width: 100px; }

.parent {
     white-space: nowrap;
}

.child {
    display:inline-block;
    width:300px;
    white-space: normal;
}