-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtraversyGrid.html
56 lines (51 loc) · 5.5 KB
/
traversyGrid.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
54
55
56
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<link rel="stylesheet" href="traversyGrid.css" />
</head>
<body>
<div class="contain">
<div class="grid-container">
<div class="grid-item grid-item-3">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dignissimos expedita accusantium ex, hic, porro molestias amet voluptatem at officia maiores sit rerum quos modi laborum inventore eum fuga laudantium. Saepe dignissimos, ex labore velit laudantium amet enim quos maiores. Totam doloribus eveniet ut aut corporis suscipit dolore. Temporibus, quos est.
</div>
<div class="grid-item grid-item-0">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Error eaque harum minus in, expedita assumenda? Ut est voluptatem quo praesentium laborum quaerat sequi itaque blanditiis fugit eaque error, asperiores voluptatum minima sunt adipisci esse architecto rem porro minus accusantium? Minus facilis amet sint totam aliquam quasi iste ullam accusantium sed tenetur dicta quaerat unde accusamus adipisci in architecto, temporibus quae quibusdam doloremque qui et. Esse quis deleniti est sit quae explicabo aspernatur fugit praesentium eaque culpa, veritatis illo perspiciatis rem doloribus aliquid sequi voluptates et beatae molestias, provident, nam minima quasi vel! Vel, ratione cupiditate assumenda, veritatis soluta laborum repellendus nulla cum vero minima sapiente, nisi tempore itaque! Repellendus in maxime consectetur esse ipsa fuga ab beatae voluptates? Distinctio repellendus quas delectus quidem, sint animi quos beatae nisi nostrum cumque inventore, saepe dolorem assumenda numquam dicta. Eum atque eos beatae iure quasi pariatur earum accusantium ipsa? Sit fugiat, laboriosam fuga soluta velit totam, molestias fugit, aperiam eveniet earum officiis reprehenderit repellat non quia! Commodi enim in eum assumenda beatae! In non amet saepe eos, rem fugit nam facere quia unde tempore inventore dolorem! Minus facilis commodi cumque rem, iure accusantium asperiores quisquam numquam, aliquid nihil consequuntur doloremque modi ullam eos.
</div>
<div class="grid-item grid-item-1">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dignissimos expedita accusantium ex, hic, porro molestias amet voluptatem at officia maiores sit rerum quos modi laborum inventore eum fuga laudantium. Saepe dignissimos, ex labore velit laudantium amet enim quos maiores. Totam doloribus eveniet ut aut corporis suscipit dolore. Temporibus, quos est.
</div>
<div class="grid-item grid-item-2">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Error eaque harum minus in, expedita assumenda? Ut est voluptatem quo praesentium laborum quaerat sequi itaque blanditiis fugit eaque error, asperiores voluptatum minima sunt adipisci esse architecto rem porro minus accusantium? Minus facilis amet sint totam aliquam quasi iste ullam accusantium sed tenetur dicta quaerat unde accusamus adipisci in architecto, temporibus quae quibusdam doloremque qui et. Esse quis deleniti est sit quae explicabo aspernatur fugit praesentium eaque culpa, veritatis illo perspiciatis rem doloribus aliquid sequi voluptates et beatae molestias, provident, nam minima quasi vel! Vel, ratione cupiditate assumenda, veritatis soluta laborum repellendus nulla cum vero minima sapiente, nisi tempore itaque! Repellendus in maxime consectetur esse ipsa fuga ab beatae voluptates? Distinctio repellendus quas delectus quidem, sint animi quos beatae nisi nostrum cumque inventore, saepe dolorem assumenda numquam dicta. Eum atque eos beatae iure quasi pariatur earum accusantium ipsa? Sit fugiat, laboriosam fuga soluta velit totam, molestias fugit, aperiam eveniet earum officiis reprehenderit repellat non quia! Commodi enim in eum assumenda beatae! In non amet saepe eos, rem fugit nam facere quia unde tempore inventore dolorem! Minus facilis commodi cumque rem, iure accusantium asperiores quisquam numquam, aliquid nihil consequuntur doloremque modi ullam eos.
</div>
<div class="grid-item grid-item-3">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dignissimos expedita accusantium ex, hic, porro molestias amet voluptatem at officia maiores sit rerum quos modi laborum inventore eum fuga laudantium. Saepe dignissimos, ex labore velit laudantium amet enim quos maiores. Totam doloribus eveniet ut aut corporis suscipit dolore. Temporibus, quos est.
</div>
<!-- <div class="grid-item grid-item-2"></div>
<div class="grid-item grid-item-3"></div>
<div class="grid-item grid-item-4"></div>
<div class="grid-item grid-item-5"></div>
<div class="grid-item grid-item-6"></div>
<div class="grid-item grid-item-7"></div>
<div class="grid-item grid-item-8"></div>
<div class="grid-item grid-item-9"></div>
<div class="grid-item grid-item-10"></div>
<div class="grid-item grid-item-11"></div>
<div class="grid-item grid-item-12"></div>
<div class="grid-item grid-item-13"></div>
<div class="grid-item grid-item-14"></div>
<div class="grid-item grid-item-15"></div>
<div class="grid-item grid-item-16"></div>
<div class="grid-item grid-item-17"></div>
<div class="grid-item grid-item-18"></div> -->
<!--
<div class="axis main-axis"></div>
<div class="axis cross-axis"></div> -->
</div>
</div>
</body>
</html>