The text-overflow Property

OmIndia April 23, 2018

Show truncated text normally, but show full text on hover ...

<!DOCTYPE html>
<html>
<head>
<style>
.a {
white-space: nowrap;
width: 200px;
overflow: hidden;
text-overflow:ellipsis;

}

.a:hover {
overflow: visible;
}
</style>
</head>
<body>

<h1>The text-overflow Property</h1>

<p>Hover over the div below, to see the entire text.</p>

<div class="a">This is some long text that will not fit in the box.</div>

</body>
</html>