Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
Selected Reading
Display the overflowed content when hovering over the element with CSS
To display the overflowed content while hovering over elements, you can try to run the following code:
Example
<!DOCTYPE html>
<html>
<head>
<style>
div.demo {
white-space: nowrap;
width: 180px;
overflow: hidden;
border: 2px solid blue;
}
div.demo:hover {
text-overflow: inherit;
overflow: visible;
}
</style>
</head>
<body>
<p>Hover to see the complete text below:</p>
<br>
<div class = "demo" style = "text-overflow:clip;">Demo Text that will hide in this box.</div>
</body>
</html> 
Updated on: 2020-06-23T15:48:59+05:30
3K+ Views
Advertisements