CSS Overflow Tutorial

#html #css #webdev #beginners

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

The Future of AI, LLMs, and Observability on Google Cloud

Datadog sat down with Google’s Director of AI to discuss the current and future states of AI, ML, and LLMs on Google Cloud. Discover 7 key insights for technical leaders, covering everything from upskilling teams to observability best practices

Learn More