CSS div динамическая ширина

Question

У меня небольшая проблема с шириной div.Я показываю вам изображение того, что у меня есть

.

Существует внешний div, который не имеет заданной ширины, он может быть маленьким или большим.

Onсправа мы получили изображение, плавающее справа.

Текстовый div содержит динамическую ширину, которая заполняет все неопределенное пространство ширины.и внутри текста с неопределенной шириной.

Я хочу, чтобы переполнение Text Div было скрыто, когда ширина текста превышает пространство Text Div.

Проблема заключается в том, как указатьширина, чтобы получить переполнение на динамической ширине?Если я не укажу ширину, изображение будет идти под текстом, если оно слишком длинное.

Надеюсь, я был достаточно четким.

Спасибо за помощь.

Редактировать:

Вот фрагмент кода, который будет более понятным.

<div class="outside">
    <img src="img.jpg" class="img"/>
    <div class="text"><p>some text that is too long</p></div>
</div>

<style>
.img {
    float: right;
}
.text {
    float: left;
    overflow: hidden;
}
</style>

Проблема в том, что .text не имеет определенной ширины, поэтому переполнение неработа

Answer 1

ДЕМО ЗДЕСЬ

так позвольте мне получить это прямо:

• вы хотите, чтобы текст обрезался при переполнении
• однако вы хотите установить ограничения, используя div, в котором он содержится (который является динамическим)

попробуйте это

<div class="container">
    <img src="myimage.jpg" />
    <div class="flexi"> some long content</div>
</div>

img{
    float:right;
}

.container{
    overflow:hidden;
    zoom:1;
}

.flexi{
    white-space: nowrap;
    overflow:hidden;
    zoom:1;
}

Answer 2

Вы можете зафиксировать ширину Text div, чтобы он занимал процент от внешнего div и оставить оставшееся место для изображения в зависимости от размера вашего изображения.

Проверьте здесь

отредактировано, чтобы поставить правильную ссылку.

Answer 3

Насколько я понимаю, вы хотите, чтобы по мере того, как и когда ваш DIV заполнялся каким-то текстом, его ширина должна быть соответственно увеличена. попробуйте это:

div
{
width:150px;
height:150px;
overflow:hidden;
} 

При использовании этого переполненный текст, размер которого превышает 150 пикселей, не будет отображаться.

Answer 4

Существует множество решений:

Один пример:

http://jsfiddle.net/SHYZR/