long text break using ellipsis

by Kheema Pandey

HTML

<span class='more'>abbcccccccccccccccccccccccccccccccccccccccccccccccccccc</span>

CSS

.more{
    display:inline-block;
    width: 50px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.more:hover{
    white-space:initial;
    cursor:pointer;
    width:100%;
}