transition.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div{
            background-color: #00ff00;
            font-family: 'Courier New', Courier, monospace;
            width: 150px;
            height: 70px;
            margin: auto;
            overflow: hidden;
            transition: width 2s;
        }
        div:hover{
            width: 500px;
            height: 500px;
        }
    </style>
</head>
<body>
    <div>
        <h1>Hello</h1>
        <h2>am a fullstack developer</h2>
        <p>Lorem ipsum dolor sit amet, consectetur adipisling elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.Lorem ipsum dolor sit amet, consectetur adipisling elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi  it aliquip exea commodo consiquat</p>
    </div>
    
</body>
</html>