Skip to main content

CSS Tutorial 20

 <!DOCTYPE html>

<html lang="en">


<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>BoX Modle</title>

</head>

<style>

    .container{

        background-color: rosybrown;

        border: royalblue 2px solid;

        padding-top: 10px;

        padding-left: 20px;

        padding-right: 30px;

        padding-bottom: 40px;


         /* top right bottom left */

        /* padding: 5px 7px 8px 10px; */




        margin-top: 0px;

        margin-left: 0px;

        margin-right: 0px;

        margin-bottom: 0px;


    

    }

</style>


<body>

    <div class="container">

        <h3>This is my Heading</h3> 

    <p id="first">Lorem ipsum dolor sit amet consectetur adipisicing elit. Illo modi minus perferendis magnam itaque

        tempora, delectus nam eos, expedita assumenda laborum nemo porro dicta doloremque nobis sunt voluptates sapiente

        voluptas est labore eum laboriosam. Dolore.</p> </div>



    <div class="container">

        <h3>This is my Heading</h3>

    <p id="first">Lorem ipsum dolor sit amet consectetur adipisicing elit. Illo modi minus perferendis magnam itaque

        tempora, delectus nam eos, expedita assumenda laborum nemo porro dicta doloremque nobis sunt voluptates sapiente

        voluptas est labore eum laboriosam. Dolore.</p>    </div>


    <div class="container">

        <h3>This is my Heading</h3>

    <p id="first">Lorem ipsum dolor sit amet consectetur adipisicing elit. Illo modi minus perferendis magnam itaque

        tempora, delectus nam eos, expedita assumenda laborum nemo porro dicta doloremque nobis sunt voluptates sapiente

        voluptas est labore eum laboriosam. Dolore.</p>    </div>


</body>


</html>

Labels:

Comments

Post a Comment

Popular posts from this blog

Side Navigation Bar CSS

 *{     background-color: #353b48; } body{     margin: 0px;     padding: 0px;     font-family: cursive; } .navbar{     position: absolute;     top: 50%;     transform: translateY(-50% ); }      .navbar a{     text-decoration: none;     display:block;     margin: 8px 0px;    padding: 8px;    width: 130px;    font-size: 22px;    /* background-color: #e74c3c; */    color: white;    margin-left: -100px;    border-radius: 10px;    transition: 0.6s; } .navbar a:hover{     margin-left: 0px; }
Post a Comment
Read more

Web 2 Sign in

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Sign Up window</title>     <style>         * {             box-sizing: border-box;         }         body {             /* justify-content: center; */             /* align-items: center; */             margin: 0px;             padding: 0px;             font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;             color: black;             background-color: #e9faff;         }         .cont {   ...
Post a Comment
Read more

Side Navigation Bar 1

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Document</title>     <link rel="stylesheet" href="style.css"> </head> <body>     <div class="navbar">         <a href="#" style="background-color: #27ae60;">Home</a>         <a href="#" style="background-color: #c0392b;">About</a>         <a href="#" style="background-color: #ba21d8;">Gellary</a>         <a href="#" style="background-color: #2980b9;">Contact</a>     </div> </body> </html>
Post a Comment
Read more