[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: блок расползается, как с этим бороться
WhiteKnight
#content {
text-align: left;
width:800px;
max-width:800px;
margin: 0 auto;
padding-top: 15px;
}

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



Спустя 17 минут, 6 секунд (1.01.2010 - 19:21) sergeiss написал(а):
А этот блок - это что? ДИВ, или что-то другое?

Добавь внутрь этого контейнера textarea, и там выводи текст. Тогда он будет выводиться нормально, с переносом целыми словами.

PS. И вообще. 1-го января отдыхать надо smile.gif С НГ тебя! wink.gif

Спустя 9 минут, 10 секунд (1.01.2010 - 19:30) WhiteKnight написал(а):
наверно это извращенство будет

вот код который виводит контент

....
?><form><textarea><?php
echo $content;
?></textarea></form><?php
....



выводит:

<form><textarea>ssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</textarea></form>


вот у вас на форуме тоже расползается..

Спустя 1 минута, 40 секунд (1.01.2010 - 19:31) WhiteKnight написал(а):
sergeiss , тоже отдыхал. но решил взять за старые проекты которые запланировал.. завтра и послезавтра все равно гуляю...так что вот сейчас надо кодить пока есть время.


И Тебя С новым 2010! Всего хорошего! smile.gif

Спустя 12 минут, 41 секунда (1.01.2010 - 19:44) vagrand написал(а):
WhiteKnight

Ну так ты выводиш непрерывную строку. При помощи CSS ты никак это не починиш. Как вариант можеш разбить эту строк пробелами через каждые N символов.

Спустя 3 минуты, 24 секунды (1.01.2010 - 19:47) WhiteKnight написал(а):
может я просто придирчивый blink.gif
ну вот на этом форуме тоже все ползет

Спустя 7 минут, 25 секунд (1.01.2010 - 19:55) vagrand написал(а):
WhiteKnight

Разве я говорил что это не нормальное поведение?

Спустя 14 часов, 8 минут, 53 секунды (2.01.2010 - 10:04) ApuktaChehov написал(а):
WhiteKnight
Текст переноситься только если в нем имеются пробелы. Иначе как его перенести?
Откуда браузеру знать, где делать перенос? Он ориентируется только по пробелам.

Спустя 2 дня, 3 часа, 31 минута, 15 секунд (4.01.2010 - 13:35) Gabriel написал(а):

Спустя 3 дня, 7 часов, 33 минуты, 16 секунд (7.01.2010 - 21:08) WhiteKnight написал(а):
такс.. стола пока нету, сижу мучаюсь вот с этой проблемой.

Вот взять к примеру этот форум если уменьшать размеры окна все сходится и ничего не ползет и это резина у меня резина тоже и все таки вылазит текст из среднего блока когда уменьшаю размеры.

И как реализовать так что бы текст не вылазил, без разницы прерывный или не прерывный..

WordWrap(пробовал) неподойдет потому что в нем фиксированая ширина на сколько я понял. Если у меня резина то ли бо ставить минимальное допустимое значение, но на большем екране это будет маленький блок с текстом либо нормальное значение, но тогда при уменьшении размеров блок весь будет выходить


Спустя 2 часа, 58 минут, 23 секунды (8.01.2010 - 00:07) dr_Lev написал(а):
Попробуй
word-wrap:break-word;
но помоему мозилла не понимает такого...
А так, может javascript поможет? а именно использовать метод getBoundingClientRect()...
Т.е. берешь текст, вставляешь его в невидимый, не блочный элемент, смотришь его ширину (getBoundingClientRect().right - getBoundingClientRect().left), и отсюда пляшеш... вставляешь пробелы в нужных местах...

Спустя 30 минут, 5 секунд (8.01.2010 - 00:37) dr_Lev написал(а):
Вот, набросал кое-что :

//Функция определяет ширину текста
function getWidth(str){
var span = document.createElement('SPAN');
span.style.visibility = 'hidden';
span.style.position = 'absolute';
span.innerHTML = str;
document.body.appendChild(span);
var width = span.getBoundingClientRect().right - span.getBoundingClientRect().left;
document.body.removeChild(span);
return width;
}

var text = document.getElementById("content").innerHTML; //нужный длинный текст
var strlen = text.length; //кол-во символов в строке
var width = getWidth(text); // ширина текста в пикселях
var rowlen = Math.floor(800*strlen/width); // среднее кол-во символов в одной строке
var rows = Math.ceil(strlen/rowlen); // количество строк, будет в итоге

//это небольшая корректировка, у меня почему-то rowlen было на 2 символа
//больше, чем нужно... причину не искал, решил так исправить

var i = 0;
while (true){
if (getWidth(text.substr(0,rowlen - i)) < 800){
break;
}else{
i++;
}
}

rowlen-=i;

// ну и формирование нужной строки
var output = '';
for (i=0; i<rows; i++){
output+= text.substr(i*rowlen,rowlen)+"\n";
}

//и вывод ее в нужный блок
document.getElementById('content').innerHTML = output;


Правда, это не идеал... тут много чего нужно еще доработать, но надеюсь суть понятна...
Пример можно глянуть тут
Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2025 Invision Power Services, Inc.