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

HTML Tutorial 9

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Inline & Block Elements</title> </head> <body>      </body> </html>
Post a Comment
Read more

CSS Tutorial 24

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>CSS Display Property</title>     <style>         *{             box-sizing: border-box;         }         header {             margin: auto;             border: 2px solid firebrick;             /* width: 30%; */         }         img {             /* display: inline; this is most property display inline, block and inline block */             /* if you select display inline so...... you do not set width but */             /* you select displ...
Post a Comment
Read more

HTML Tutorial 5

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Heading Paragraphs and Emmet</title> </head> <body> <h1>Heading 1 for Rajendra </h1>     <h2>Heading 2 for Rajendra </h2>     <h3>Heading 3 for Rajendra </h3>    <!-- if you need some example world so you use loram12 for 12 words --> <p> • Incompatible: the chosen fixed size may be too large for a user's available live space, causing the user to scroll in order to view the whole page; a fixedWeb page may also appear too small, leaving unsightly blank spaces.     <!-- <br> tag use for a line break or line change and it is self closing tags -->     <br>• Totalitarian: the Web does not want to run the risk of being under too mu...
Post a Comment
Read more