Блог им. oknechirik / Я бы сделал лучше

overflow: hidden
Не очень красиво, я бы сказал. Но ведь есть же замечательное, но крайне редко используемое (мне ни разу не попадалось на глаза его использование) свойство text-overflow: ellipsis
. Что удивительно, его (это свойство) поддерживает дружное семейство браузеров по имени Internet Explorer. Это свойство имеет два (согласно с сайтом MS) значения: clip
(по умолчанию) и ellipsis
, что в сочетании со свойством overflow: hidden
дает замечательный результат: текст, который не помещается в каком-либо элементе обрезается с заменой последних символов на многоточие!!! Получается очень аккуратно и симпатично.
Как это выглядит.
Некоторые браузеры, в частности Opera, требуют своего префикса для этого свойства. MSDN рекомендует так же использовать префикс -ms для ИЕ8, но понимает это свойство и без него
Проверил, что Хром 2 и Сафари 4 понимают без префиксов, а ФайрФокс 3 не понимает вовсе
Но если не использовать это свойство, то хотя бы снабдить заголовок соответствующей всплывающей подсказкой, хотя бы в виде titleИсточник: Уроки CSS на Хабрахабре
Если Вы хотите оставить заказ на разработку сайта или получить предварительную консультацию воспользуйтесь формой по ссылке ниже.
Обратная связь
Наш специалист ответит вам в течении суток.
Похожие публикации
Каскадные Таблицы Стилей / CSS хитрости IE 7: -ms-interpolation-mode
Эта тема в сети не новая, но тут статью об этом не нашла. Оказывается, у IE, начиная с версии 7, есть поддержка интерполяции (режима масштабирования) изображений и управления им через CSS-свойство... читать далее
[Из песочницы] CSS Containment
От переводчика: слог у Пола Льюиса весьма своеобразный, поэтому перевод исходной статьи местами может выглядеть странно. Замечания приветствуются. Containment (сдерживание) – новое CSS свойство,... читать далее
Каскадные Таблицы Стилей / Дрессируем box-shadow
Разработчики W3C сделали box-shadow очень гибким свойством. Благодаря этому, можно получать весьма весьма интересные результаты, если использовать это свойство нетривиальным образом. В этой статье я... читать далее
Блог им. RayZ / Задача: Кнопки в Internet Explorer и волшебные пространства
Столкнулся с проблемой укрощения кнопок под Internet Explorer. Для наглядности имеем следующий код: < html > < style type ="text/css" > .hacked { width:auto; overflow: visible;... читать далее
Web-разработка / Ещё один способ победить Internet Explorer
Рано или поздно все web-разработчики сталкиваются с ситуацией, когда Internet Explorer становится проблемой, тормозящей разработку проекта. Сайт свёрстан валидно, по стандартам. Нормально... читать далее
Немного о CSS свойством «background-image»
CSS свойство « background-image » служит для заливки чего-либо (блока, ячейки таблицы, страницы целиком) фоновым рисунком. Что можно сделать, используя это свойство?... читать далее
Прокомментировать
Облако тегов
angular css CSS es6 frontend habrahabr.ru HTML html html5 JavaScript javascript js react ReactJS seo SEO на Хабрахабре vue Блог компании RUVDS.com Веб-дизайн Интернет-маркетинг Поисковая оптимизация Программирование Разработка веб-сайтов Уроки CSS на Хабрахабре автомобильный сайт блог браузеры верстка вёрстка дайджест интернет-магазин информационный ресурс корпоративный сайт модуль мы рекомендуем портфолио разработка ссылки фронтенд
Реклама на сайте
Веб-студия https://hover.com.ua/ в Киеве