-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
53 lines (53 loc) · 1.96 KB
/
index.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Flexbox Cards</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="page-header">
<h1>flexbox homework.</h1>
<p>Hover over the cards and images for magic!</p>
</div>
<div class="container">
<div class="card">
<img src="1.jfif" alt="Image 1">
<h3>I love trees!</h3>
<p>I love trees and so should you! they are amazing.</p>
<button>Here's why</button>
</div>
<div class="card">
<img src="2.jfif" alt="Image 2">
<h3>CHAMELEONN!!!</h3>
<p>they can change colours and they are soooo cute! i wish i was a chameleon so i could change colours.</p>
<button>Here's how</button>
</div>
<div class="card">
<img src="3.jfif" alt="Image 3">
<h3>..grass?</h3>
<p>I couldn't find any other picture so i used this picture of some grass..</p>
<button>Read more</button>
</div>
<div class="card">
<img src="4.webp" alt="Image 4">
<h3>Best in class</h3>
<p>Imagine jumping into that boat, and just letting it sail wherever the wind takes you...</p>
<button>Just do it...</button>
</div>
<div class="card">
<img src="5.webp" alt="Image 5">
<h3>Dynamically innovate supply chains</h3>
<p>Holistically predominate extensible testing procedures for reliable supply chains.</p>
<button>Here's why</button>
</div>
<div class="card">
<img src="6.webp" alt="Image 6">
<h3>Sanity check</h3>
<p>Objectively innovate empowered manufactured products whereas parallel platforms.</p>
<button>Stop here</button>
</div>
</div>
</body>
</html>