Fill Text Effect On Hover(mouse over) using CSS content Property

You can add css Pseudo-classes “:before” selector, using CSS content Property “{content:attr();}” CSS h1 { margin:0px; padding:0px; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); font-size:8em; color:green; font-family:Verdana, Geneva, sans-serif; text-transform:uppercase; } h1:before { position:absolute; content:attr(data-text); top:0px; left:0px; color:red; width:0%; overflow:hidden; transition:1s; } h1:hover:before {width:100%;} HTML <!DOCTYPE HTML> READ MORE

How to insert more than one line ellipsis dot(…) using “line-clamp” in css3

How to insert more than one line ellipsis dot(…) using “line-clamp” in css3 If you need to truncate text after one line, then the text-overflow: ellipsis; is a great option - or any of the other text-overflow values. If you need to truncate text after more than one line, however, things READ MORE