перенос длинного текста на несколько строк

@gamesoneve · Регистрация: 13.09.2012

Author24 — интернет-сервис помощи студентам

здравствуйте

хочу вывести на дивах блоки вида: слева картинка, справа от неё пара блоков текста. Проблема в том, что когда текст не влезает рядом с картинкой, он автоматически отображается под картинкой. Мне нужно, чтобы если текст не помещался в строку, он бы выводился в 2 строки, но не под картинкой

) код html:

HTML5

        <div>
            <div class="img"><img width="120px" height="95px" src="image.jpg" /></div>
            <div class="title">заголовок большой:)</div>
            <div class="view">ещё что-нибудь</div>
            <div class="com">еще поле</div>
        </div>

css:

CSS

.img img{
    float:left;
    clear: both;
    margin: 5px 0 0 0px;
}
 
.title{
    font-family: "Tahoma";
    font-weight: 900;
    float:left;
    margin: 3px 0 0 7px;
    height: 40px;
}
 
.view{
    float:left;
    color: #555555;
    font-size: 12px;
    margin: 13px 0 3px 7px;
}
 
.com{
    float:left;
    color: #555555;
    font-size: 12px;
    margin: 3px 0 3px 7px;
}

@eternity · 12.12.2012, 12:10

обратите внимание на теги (для переноса в предполагаемом месте) и для переноса в нужном вам месте

@gamesoneve · 12.12.2012, 13:58 **[ТС]**

проблема в том, что сложновато вставить тег переноса строки в переменую

)

Добавлено через 3 минуты
вставил в переменную, но строчки она не хочет переносить =\
а переносит каждое слово, что тоже не подходит

Добавлено через 6 минут
таки удалось сделать норм вывод

спасибо

@Taatshi · 12.12.2012, 14:10

gamesoneve, напишите, пожалуйста, как сделали - может, кому и пригодится.

@gamesoneve · 12.12.2012, 14:22 **[ТС]**

в переменную запихал + в ксс указал min-width и max-width

Добавлено через 1 минуту
так как под картинкой места явно больше, чем рядом с ней, максимальная ширина должна быть равна ширине поля рядом с картинкой

@eternity 12 / 12 / 0 Регистрация: 23.11.2012 Сообщений: 37
	12.12.2012, 12:10	2
	обратите внимание на теги <wbr> (для переноса в предполагаемом месте) и <br> для переноса в нужном вам месте 1

@gamesoneve 1 / 1 / 0 Регистрация: 13.09.2012 Сообщений: 94
	12.12.2012, 13:58 [ТС]	3
	проблема в том, что сложновато вставить тег переноса строки в переменую) Добавлено через 3 минуты вставил <wbr/> в переменную, но строчки она не хочет переносить =\ а <br/> переносит каждое слово, что тоже не подходит Добавлено через 6 минут таки удалось сделать норм вывод спасибо 1

@Taatshi Администратор 12268 / 5333 / 268 Регистрация: 05.04.2011 Сообщений: 14,086 Записей в блоге: 2
	12.12.2012, 14:10	4
	gamesoneve, напишите, пожалуйста, как сделали - может, кому и пригодится. 0

@gamesoneve 1 / 1 / 0 Регистрация: 13.09.2012 Сообщений: 94
	12.12.2012, 14:22 [ТС]	5
	в переменную запихал <wbr/> + в ксс указал min-width и max-width Добавлено через 1 минуту так как под картинкой места явно больше, чем рядом с ней, максимальная ширина должна быть равна ширине поля рядом с картинкой 0

Опции темы