CSS/aboutme.html at main · markc1914/CSS · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/styles.css">
    <title>About Me</title>
</head>
<body>
    <header><h1 class="no-margin">About Me</h1></header>
    <div class="maxwidth">
        <nav>
            <ul>
                <li><a href="index.html">Main</a></li>
                <li><a href="aboutme.html">About Me</a></li>
                <li><a href="contactme.html">Contact Me</a></li>
            </ul>
        </nav>
        <main>
            <section class="non-main-pages">
                <article>
                    <span class="banner">More about Me</span>
                    <p class="width-80-percent">
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nisl nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit. Nibh nisl condimentum id venenatis. Sed faucibus turpis in eu mi bibendum neque egestas. Orci porta non pulvinar neque laoreet suspendisse interdum. Nulla malesuada pellentesque elit eget gravida cum sociis. Faucibus a pellentesque sit amet porttitor. Amet consectetur adipiscing elit duis tristique sollicitudin nibh sit amet. Varius sit amet mattis vulputate enim nulla aliquet. Erat pellentesque adipiscing commodo elit at. Sed turpis tincidunt id aliquet risus feugiat in ante. Phasellus faucibus scelerisque eleifend donec pretium vulputate sapien nec.
                    </p>
                    <p class="width-80-percent">
                        Suspendisse in est ante in nibh mauris cursus mattis molestie. Nunc scelerisque viverra mauris in aliquam sem fringilla ut. Purus in mollis nunc sed id semper risus in. Facilisis volutpat est velit egestas dui id. Aenean sed adipiscing diam donec adipiscing. Lacinia quis vel eros donec. Tellus in metus vulputate eu scelerisque felis. Vitae nunc sed velit dignissim sodales. Ultrices tincidunt arcu non sodales neque sodales. Varius duis at consectetur lorem donec massa sapien faucibus et. Varius duis at consectetur lorem donec. Dui accumsan sit amet nulla. Ullamcorper malesuada proin libero nunc consequat interdum varius. Dui sapien eget mi proin sed libero enim sed. Dictum fusce ut placerat orci nulla.
                    </p>
                </article>
                <article>
                    <span class="banner">This is a list of things I do in my spare time</span>
                    <table>
                        <thead>
                            <tr>
                                <th class="summary">Hobby</th>
                                <th class="details">Details</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td class="summary-field">Call of Duty</td>
                                <td class="detail-field">Prestige 6 on Modern Warfare 3</td>
                            </tr>
                            <tr>
                                <td class="summary-field">Madden NFL Football</td>
                                <td class="detail-field">Participate in online Leagues</td>
                            </tr>
                            <tr>
                                <td class="summary-field">Language</td>
                                <td class="detail-field">Learning Spanish with Babbel</td>
                            </tr>
                            <tr>
                                <td class="summary-field">Technical Skills</td>
                                <td class="detail-field">Upskilling on front end web development</td>
                            </tr>
                        </tbody>
                    </table>
                </article>
            </section>
        </main>
    </div>
</body>
</html>