Не работает text-overflow. Каким образом решается данная проблема?
.item {
padding: 10px 10px;
border-top: 1px solid #DCDCDC;
border-bottom: 1px solid #DCDCDC;
background: #F7F7F7;
margin-bottom: 5px;
position: relative;
}
#description {
color: black;
text-overflow: ellipsis;
}
Ответ
С помощью двух данных свойств можно "починить" text-overflow.
white-space: nowrap - запрещаем делать перенос на другую строку.
overflow: hidden - непосредственно скрываем текст, выходящий за рамки контейнера, для того чтобы в силу вступило свойство text-overflow.
.search_page_item {
padding: 10px 10px;
border-top: 1px solid #DCDCDC;
border-bottom: 1px solid #DCDCDC;
background: #F7F7F7;
margin-bottom: 5px;
position: relative;
}
#description {
color: black;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
Комментариев нет:
Отправить комментарий