-
Notifications
You must be signed in to change notification settings - Fork 0
/
flex.html
51 lines (46 loc) · 2.15 KB
/
flex.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Flexbox</title>
<style>
.container {
display: flex;
gap: 10px;
}
p {
background-color: darkseagreen;
}
</style>
</head>
<body>
<body>
<h1>Flexbox</h1>
<div class="container">
<div class="one">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus eveniet minus dolor qui laudantium
molestias repudiandae reprehenderit impedit aliquid, fugit eligendi placeat, unde praesentium, vel veritatis
voluptate ex corporis magni deleniti. Ipsum id at ad quo neque eos ducimus similique aliquam, modi unde soluta
inventore non eius tenetur quibusdam corrupti!</p>
</div>
<div class="two">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cumque nobis rem ipsa voluptatibus, recusandae illum
consequuntur cum, nulla dolores eligendi fuga harum labore animi dolorum asperiores voluptate praesentium
beatae, quibusdam sapiente illo ullam cupiditate officiis. Qui consequuntur sit quaerat atque magni possimus,
nemo, pariatur incidunt delectus laborum veritatis placeat fugit.</p>
</div>
<div class="three">
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Possimus, voluptatem officia nulla minus, sunt nam
aliquam quis explicabo consequatur beatae at? Eligendi corrupti quisquam enim accusantium possimus quis esse
praesentium! Obcaecati repudiandae commodi, earum eaque velit voluptatum illum temporibus. Corporis quod
dolorem
officia, optio eos fuga. Voluptatum repellat maiores laborum rem voluptas esse. Hic consequuntur, quidem nobis
suscipit iste autem quae! Itaque ut doloribus eaque quidem quam nostrum eos quibusdam, id vero optio
consectetur
velit ipsum architecto ad maiores modi aperiam nemo sed est molestiae? Facere velit magnam assumenda ullam
veniam officia ea doloribus dolor. Atque, dolore exercitationem. Expedita, eius?</p>
</div>
</div>
</body>
</html>