HTML-CSS-Pair-Programming-Lab-1/index.html at main · seagreenmedia/HTML-CSS-Pair-Programming-Lab-1 · 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
64
65
66
67
68
69
<!DOCTYPE html>
<html>

<head>
    <title>ClassiPost</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
    <meta charset="utf-8">
    <link rel="stylesheet" href="index.css">

</head>

<body>
    <div class="card" style="width: 60rem; height: 60rem">
        <div>
            <header class="turtle">
                <!--<div class="blackband">-->
                <h1>MyWebsite</h1>
                <!--</div>-->
            </header>
        </div>
        <br>
        <div>
            <div class="row">
                <div class="column">
                    <img src="gb/GB.jpg" width="300" height="300">
                    <div>
                        <h2>This is a Lorem Ipsum Heading</h2>
                        <br>
                        <span>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Dolorem veniam magni aliquid eligendi praesentium magnam reiciendis ducimus reprehenderit, alias optio consectetur aspernatur. Officiis consequatur ducimus libero optio?
                            Reiciendis, ipsam magni?</span>
                        <a href="#">Read More</a>
                    </div>
                </div>

                <div class="columnB">
                    <div class="brain">
                        <h3>Sidebar Links</h3>
                        <hr>
                        <a href="#">Link 1</a>
                        <br>
                        <a href="#">Link 2</a>
                        <br>
                        <a href="#">Link 3</a>
                        <br>
                        <a href="#">Link 4</a>
                        <br>
                    </div>
                    <br>
                    <div>
                        <h3>Other Widgets</h3>
                        <hr>
                        <p>This is Photoshop's version of Lorem ipsum dolor sit amet consectetur adipisicing elit. Ad soluta ducimus ipsum neque voluptate, molestiae maxime ratione impedit odit suscipit minus consectetur velit! Minus iure non ea alias voluptas
                            eos?
                        </p>
                    </div>
                </div>
            </div>

            <footer class="rat">
                Copyright <a href="http://eluhachi.wixsite.com/seagreenmedia"> Sea Green Media</a>. All rights reserved.
            </footer>
        </div>
        <!-- <footer class="rat">
        Copyright <a href="http://eluhachi.wixsite.com/seagreenmedia"> Sea Green Media</a>. All rights reserved.
    </footer>-->
    </div>
</body>

</html>