CSS Overflow Tutorial

Code

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title> Overflow </title>

  <style>
    #box {
      border: 1px solid red;
      width: 500px;
      height: 500px;
      /* overflow: hidden; */
      overflow: auto;
    }

    img {
      width: 100%;
      height: 100%;
    }
  </style>
</head>

<body>

  <h1> Yahoo Baba CSS Overflow </h1>

  <div id="box">

    <img src="/11/aksh.jpg" alt="">
    Lorem ipsum dolor, sit amet consectetur adipisicing elit. Beatae, dicta! Consectetur laudantium rerum quod nam, ullam adipisci fuga vero incidunt repudiandae ratione totam officiis molestias fugiat minima illo voluptatem itaque voluptate accusamus sequi id, recusandae deserunt. Asperiores aperiam aut iusto1.
    Lorem ipsum dolor, sit amet consectetur adipisicing elit. Beatae, dicta! Consectetur laudantium rerum quod nam, ullam adipisci fuga vero incidunt repudiandae ratione totam officiis molestias fugiat minima illo voluptatem itaque voluptate accusamus sequi id, recusandae deserunt. Asperiores aperiam aut iusto2.
    Lorem ipsum dolor, sit amet consectetur adipisicing elit. Beatae, dicta! Consectetur laudantium rerum quod nam, ullam adipisci fuga vero incidunt repudiandae ratione totam officiis molestias fugiat minima illo voluptatem itaque voluptate accusamus sequi id, recusandae deserunt. Asperiores aperiam aut iusto3.
  </div>
</body>

</html>

Output

Thank You.
You can follow us on:
Youtube
Instagram

Blog

CSS Overflow Tutorial

AKSH DESAI

Join Our Newsletter. No Spam, Only the good stuff.

Related