Complete-Web-Development-BootCamp/tut6.htm at master · SakshamAgg1709/Complete-Web-Development-BootCamp · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Display property</title>
    <style>
img{
    margin: auto;
    width: 34px;
display: block;
}
    h3{
        font-family: Georgia, 'Times New Roman', Times, serif;
        text-align: center;
        margin: 0px;
    }

    header{

        border: 2px solid red;
       margin: auto;

    }

    .box{
        border: 4px solid blue;
    background-color: brown;
    margin: 4px;
    padding: 23px;
    width: 443px;
    box-sizing: border-box;
    display: inline-block;
    float: left;
    }
    .container{
        margin: auto;

        width: 1200%;
    }
    </style>
</head>
<body>
    <header class="top">
        <h3>Welcome to Saksham's BLOG</h3>
        <img src="https://lh3.googleusercontent.com/ogw/ADGmqu95qFR6hwDo-5bY0jX8o3rpwLObDYvb6aPBkKzn=s32-c-mo" alt="">
    </header>
    <div class="container">
        <div class="box">
            <h4 class="heading">
                <p>
                    Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ut labore dicta officia repellat quam omnis, aliquid ullam repellendus doloremque dolorum asperiores accusantium dolor dolore eveniet perspiciatis ratione vel nam neque veritatis. Incidunt blanditiis id cumque dolores cupiditate harum quasi eius!
                </p>
            </h4>
        </div>
    </div>
    <div class="container">
        <div class="box">
            <h4 class="heading">
                <p>
                    Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ut labore dicta officia repellat quam omnis, aliquid ullam repellendus doloremque dolorum asperiores accusantium dolor dolore eveniet perspiciatis ratione vel nam neque veritatis. Incidunt blanditiis id cumque dolores cupiditate harum quasi eius!
                </p>
            </h4>
        </div>
    </div>
       <div class="container">
            <div class="box">
            <h4 class="heading">
                <p>
                    Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ut labore dicta officia repellat quam omnis, aliquid ullam repellendus doloremque dolorum asperiores accusantium dolor dolore eveniet perspiciatis ratione vel nam neque veritatis. Incidunt blanditiis id cumque dolores cupiditate harum quasi eius!
                </p>
            </h4>
        </div>
    </div>

</body>
</html>