Многие из нас пользуются почтовыми сервисами Google и Яндекса. Наверняка все замечали, как при сужении окна браузера обрезается текст в строке темы письма. На сайтах, где нужно представлять список со множеством строк и длинными надписями в них, этот прием незаменим.
Смотреть пример
Заключаем текст, который будем обрезать, в div и прописываем для него overflow: hidden. Для таблицы обязательно нужно прописать table-layout:fixed.
Чтобы сделать эффект “затухания” теста, в конце строки накладываем на него прозрачный градиент. Не забываем вынести хаки для IE в отдельный файл, чтобы наша страница проходила валидацию css.
Если есть вопросы, спрашивайте :)
Оу. Клевый приемчик.
Положил её в свою копилку нужных идей (-:
Хороший прием. Пополню им свою базу закладок по теме верстки. Возможно пригодится в дальнейшей разработке сайтов. Недавно начал изучать W3C-валидную верстку. Спасибо. :-)
Вам нужна Html/Css верстка сайта? Webmolot поможет Вам сделать кроссбраузерную, валидную, сематнически правильную верстку Вашего сайта в кратчайшие сроки.