-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
61 lines (57 loc) · 3.74 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
54
55
56
57
58
59
60
61
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Responsive Grid Layout</title>
<link rel="stylesheet" type="text/css" media="screen" href="main.css" />
</head>
<body>
<div class="wrapper">
<header class="box">HEADER</header>
<nav class="box">
<ul>
<li>NAV LINK</li>
<li>NAV LINK</li>
<li>NAV LINK</li>
<li>NAV LINK</li>
</ul>
</nav>
<main class="box">MAIN CONTENT Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam quo, soluta maiores corporis quod odio
vero fuga cumque doloremque tempora deleniti magnam nesciunt, fugiat accusamus porro veritatis pariatur impedit
illo, sed optio nam facere. Laudantium rem earum natus magnam id dicta quia cumque delectus, quos aliquam nobis
doloremque et eveniet tenetur, vitae repudiandae ullam! Eum facere voluptatem soluta incidunt itaque doloribus
sunt obcaecati nulla quas aut? Dolor amet fugiat laudantium alias corporis. Facere ab obcaecati exercitationem
ipsum enim perferendis, voluptatum magni, explicabo nam similique fugiat deleniti architecto hic tempore ipsa
omnis mollitia deserunt reprehenderit, temporibus doloribus pariatur soluta commodi. Veritatis!
</main>
<section class="section1 box">SECTION 1 - Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facilis odit rem molestiae? Dignissimos obcaecati, necessitatibus
alias optio laudantium, placeat error exercitationem quasi quas explicabo perspiciatis sunt autem tenetur at.
Et illum sit magnam, quibusdam iste rerum necessitatibus ad in fugit dignissimos. Ad ratione deserunt a quaerat
ullam sunt voluptatem reprehenderit.
</section>
<section class="section2 box">SECTION 2 - Lorem ipsum dolor sit amet consectetur adipisicing elit. Nostrum adipisci asperiores illum nobis dolorem! Numquam
nobis unde porro quam et labore iusto nesciunt veniam animi vel quia voluptatem illo, ab excepturi consequatur
eum libero iure optio officia dignissimos voluptates quod quos. Odio, saepe? Debitis beatae sit, doloribus sint
maxime veniam?
</section>
<section class="section3 box">SECTION 3 - Lorem ipsum dolor sit amet consectetur adipisicing elit. Nostrum adipisci asperiores illum nobis dolorem! Numquam
nobis unde porro quam et labore iusto nesciunt veniam animi vel quia voluptatem illo, ab excepturi consequatur
eum libero iure optio officia dignissimos voluptates quod quos. Odio, saepe? Debitis beatae sit, doloribus sint
maxime veniam?
</section>
<section class="section4 box">SECTION 4 - Lorem ipsum dolor sit amet consectetur adipisicing elit. Nostrum adipisci asperiores illum nobis dolorem! Numquam
nobis unde porro quam et labore iusto nesciunt veniam animi vel quia voluptatem illo, ab excepturi consequatur
eum libero iure optio officia dignissimos voluptates quod quos. Odio, saepe? Debitis beatae sit, doloribus sint
maxime veniam?
</section>
<aside class="box">SIDE BAR Lorem ipsum dolor sit, amet consectetur adipisicing elit. Ut vel deserunt qui labore nihil! Earum animi
similique tenetur nobis ullam quidem, commodi dolore quas quaerat.
</aside>
<footer class="box">FOOTER Lorem ipsum dolor, sit amet consectetur adipisicing elit. Maxime voluptatibus dolor sint animi nobis, aliquid
soluta porro amet dolorum nostrum?
</footer>
</div>
</body>
</html>