Страница 1 из 11
Модератор форума: -SAM- 
Активный форум » WEB-мастеру » Технический раздел (домены, хостинг, настройка CMS и шаблонов) » Текст выходит за рамки расширяя тем самым шаблон.
Текст выходит за рамки расширяя тем самым шаблон.
siways Offline
Дата: Чт, 19.05.2016, 15:59:37 | Сообщение # 1
Аватарка siways
Пользователь
Сообщения: 22
Награды: 0
Отзывы: 0
Текст выходит за рамки расширяя тем самым шаблон, знает ли кто нибудь как сделать так чтоб длинный текст не был дописан полностью и конец скрывался за многоточием?
Скриншот: http://i062.radikal.ru/1605/ae/6973dae25eb9.png
-SAM- Offline
Дата: Чт, 19.05.2016, 16:27:40 | Сообщение # 2
Аватарка -SAM-
⇚ Stand Alone Man ⇛
Гл. Администратор
Сообщения: 5571
Награды: 88
Отзывы: 261
Вот читаем или в поисковик запрос "text-overflow: ellipsis;" Cnc

siways Offline
Дата: Ср, 25.05.2016, 00:39:53 | Сообщение # 3
Аватарка siways
Пользователь
Сообщения: 22
Награды: 0
Отзывы: 0
Все вроде как надо но все равно не работает эффект многоточия ,если кто знает почему помогите пожалуйста, скрины ниже

http://s020.radikal.ru/i723/1605/55/bf74d92d7885.jpg
http://s019.radikal.ru/i635/1605/2e/550beb462475.jpg
http://s018.radikal.ru/i514/1605/b6/ed7dc383af57.jpg
Сообщение отредактировал siways - Ср, 25.05.2016, 00:40:36
-SAM- Offline
Дата: Ср, 25.05.2016, 00:50:33 | Сообщение # 4
Аватарка -SAM-
⇚ Stand Alone Man ⇛
Гл. Администратор
Сообщения: 5571
Награды: 88
Отзывы: 261
Сдается мне, что там нужно оборачивать в div с классом не блок, а строку из информера (по скринам судить сложно, привык через браузер смотреть и править сразу + уже сейчас ничего не соображаю в такое время). width: 100% - не ясно зачем, без него попробовать. А еще можно строкам в информере просто задать стилизацию, к примеру такую: height:16px;line-height:16px;overflow:hidden;text-overflow:ellipsis;-o-text-overflow:ellipsis; без всего сопутствующего.

siways Offline
Дата: Ср, 25.05.2016, 01:38:40 | Сообщение # 5
Аватарка siways
Пользователь
Сообщения: 22
Награды: 0
Отзывы: 0
А как сделать div с классом не блок?, на скринах сделал немного по другому все равно не выходит

http://s020.radikal.ru/i723/1605/55/bf74d92d7885.jpg
http://s16.radikal.ru/i191/1605/15/0f40d87300ad.jpg
http://s010.radikal.ru/i314/1605/62/375304eb2d43.jpg

---Скринить нужно то что выходит, а не коды исходные. Вы лучше ссылку на сайт дайте.

А прописывать стили к уже имеющемуся классу - не катит, нужно что-то одно использовать или перекрывать одно другим с помощью !important, делая акцент на важность и приоритетность какого-то стиля перед теми, которые там в классах и других стилях.--- © -SAM-


А как это в коде с !important выглядеть должно?

---Ну, в вашем случае - никак. Нужно просто класс uRelatedEntry поправить, как выше написал.
Отмеченное красным вообще лишнее. Нужно сделать div с каким-то классом, например - podrezka, потом прописать в стилизацию .podrezka .uRelatedEntry {font-size:9pt;height:12px;line-height:14px;overflow:hidden;text-overflow:ellipsis;-o-text-overflow:ellipsis;} - это пример, значения под себя настраиваем. И если дальше разбираться - картинка в ссылке вообще лишняя, она задается сразу в стили, прописывается в свойствах background, задается no-repeat и padding.

В общем, вот так вполне хорошо скрывается:
А чтобы сработало троеточие, то нужно прописать вместо height:16px;line-height:16px; ---> white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis;
И что важно - у самого блока podrezka должна быть задана ширина (меньше ширины td, в котором он находится), иначе не будет добавлять троеточие это. Как-то так.--- © -SAM-
Активный форум » WEB-мастеру » Технический раздел (домены, хостинг, настройка CMS и шаблонов) » Текст выходит за рамки расширяя тем самым шаблон.
Страница 1 из 11
Поиск: