Html-learning-stage/placeorder.html at main · RaySpot1/Html-learning-stage · 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
78
79
80
81
82
83
<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&amp;lang=en" />

<style>

body {
    font-family: "Open Sans";
}
div.gallery {
    margin: 5px;
    border: 1px solid #ccc;
    float: left;
    width: 300px;
    /* text-align: center; */
}

div.gallery:hover {
    border: 1px solid #777;
}
div.gallery img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}
div.desc {
    margin-top: 2px;
    padding: 5px;
    text-align: center;
    font-size: 12px;
}

.order_button {
    margin-left: 95px;
    background-color: #553573;
    border-radius: 10px;
    color: white;
    padding: 10px;
    border: 0;
}

.product-u {
    padding-top: 10px;
    padding-left: 2px;
}
* {box-sizing: border-box;}
.responsive
</style>
</head>
<body>

<div class="gallery">
    <a target="_blank" href="painting.jpg">
        <img src="painting.jpg" alt="Beautiful Painting" width="600" height="400">
    </a>
    <button class="order_button">Place Order</button>
    <div class="product-u">
        <span style="margin-right: 10px;"><b>Price:</b> N3,200</span>
        <span><b>Location:</b> Yaba, Lagos</span>
    </div>
    <hr>
    <h3 style="text-align: center; margin-bottom: 5px;">Package Description</h3>
    <div class="desc">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus nec lorem est. Maecenas tincidunt dapibus odio. Proin sit amet ultricies velit. Aenean ut dignissim lacus. Suspendisse porta consectetur elit, finibus luctus tellus hendrerit ac. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
    </div>
</div>

<div class="gallery">
    <a target="_blank" href="cuties.jpeg">
        <img src="cuties.jpeg" alt="Beautiful Painting" width="600" height="400">
    </a>
    <button class="order_button">Place Order</button>
    <div class="product-u">
        <span style="margin-right: 10px;"><b>Price:</b> N4,800</span>
        <span><b>Location:</b> Yaba, Lagos</span>
    </div>
    <hr>
    <h3 style="text-align: center; margin-bottom: 5px;">Package Description</h3>
    <div class="desc">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus nec lorem est. Maecenas tincidunt dapibus odio. Proin sit amet ultricies velit. Aenean ut dignissim lacus. Suspendisse porta consectetur elit, finibus luctus tellus hendrerit ac. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
    </div>
</div>