CSS Box Model ,Margin, and, Padding

 <!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>Box Model</title>

    <style>

        body{

            background-color: rgb(129 124 131);

        }

        *{

            box-sizing: border-box;

        }

        .container{

            background-color: rgb(173 180 205);

            border: 3px solid rgb(0, 0, 0);

            padding: 19px;

            margin: 40px;

            border-top-left-radius: 34px;

            border-bottom-right-radius: 34px;

            width: 533px;

            box-sizing: border-box;

        }

    </style>

</head>

<body>

    <div class="container">

        <h3>This is my Heading</h3>

        <p id="first">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Tempore esse laboriosam vel aliquam! Quos nulla quae aliquam. Expedita veritatis impedit quo ab odit.</p>

    </div>


    <div class="container">

        <h3>This is my Heading</h3>

        <p id="second">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Tempore esse laboriosam vel aliquam! Quos nulla quae aliquam. Expedita veritatis impedit quo ab odit.</p>

    </div>


    <div class="container">

        <h3>This is my Heading</h3>

        <p id="third">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Tempore esse laboriosam vel aliquam! Quos nulla quae aliquam. Expedita veritatis impedit quo ab odit.</p>

    </div>

</body>

</html>

Comments

Popular posts from this blog

Transform Property In CSS

More on CSS Selectors