source for lucas.co
Minor changes
index.html | 7 +++++--
styles.css | 45 ++++++++++++++++++++++++++++++++++-----------
2 files changed, 39 insertions(+), 13 deletions(-)
diff --git a/index.html b/index.html
index 79b45a4..d69b3a2 100644
--- a/index.html
+++ b/index.html
@@ -8,8 +8,11 @@
</head>
<body>
- <h class="h1">Lucas Galante</h>
- <img src = "magic.gif" class="box">
+ <div class="title">Lucas Galante</div>
+ <img src = "magic.gif" class="box">
+ <div class="left"></div>
+ <div class="right"></div>
+ <div class="center"></div>
</body>
</html>
diff --git a/styles.css b/styles.css
index 4548552..8110703 100644
--- a/styles.css
+++ b/styles.css
@@ -1,17 +1,40 @@
-.x {
- color: red;
- margin: auto;
- width: 5%;
- text-align: center;
- border: 1px solid black;
+:root {
+ --width1: 11%;
+ --height1: 70%;
}
-.h1 {
-
+.title {
+ display: block;
+ margin-left: 5%;
}
.box {
display: block;
- border: 1px solid black;
- margin: auto;
- margin-top: 30px;
+ margin-left: auto;
+ margin-right: auto;
+ border: 1px solid black ;
+ margin-top: -1.5%;
padding: 10px;
}
+.left {
+ position: absolute;
+ top: 0.2%;
+ left: 20%;
+ height: var(--height1);
+ width: var(--width1);
+ background-color: black;
+}
+.right {
+ position: absolute;
+ top: 0.2%;
+ right: 20%;
+ height: var(--height1);
+ width: var(--width1);
+ background-color: black;
+}
+.center {
+ position: absolute;
+ top: 25.4%;
+ left: calc(50% - 8% / 2);
+ height: 45%;
+ width: 8%;
+ background-color: black;
+}
\ No newline at end of file