🛩👢 Checkpoint
./style.css:617503/2419 ./index.html:617503/291
This commit is contained in:
@ -17,8 +17,11 @@
|
|||||||
<div class="wrapper">
|
<div class="wrapper">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<h1>Hello world!</h1>
|
<h1>Hello world!</h1>
|
||||||
<img src="/illustration.svg" class="illustration" />
|
|
||||||
</div>
|
</div>
|
||||||
|
<img src="/illustration.svg" class="illustration" />
|
||||||
|
<button>
|
||||||
|
Remix on Glitch
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- include the Glitch button to show what the webpage is about and
|
<!-- include the Glitch button to show what the webpage is about and
|
||||||
|
|||||||
25
style.css
25
style.css
@ -4,8 +4,6 @@
|
|||||||
--main-text-color: #373fff;
|
--main-text-color: #373fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
body {
|
body {
|
||||||
font-family: helvetica, arial, sans-serif;
|
font-family: helvetica, arial, sans-serif;
|
||||||
background-color: var(--main-bg-color);
|
background-color: var(--main-bg-color);
|
||||||
@ -17,22 +15,19 @@ h1 {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.wrapper {
|
.wrapper {
|
||||||
min-height: 100vh; // height of the browser viewport
|
min-height: 100vh;
|
||||||
display: flex;
|
display: grid;
|
||||||
justify-content: center;
|
place-items: left;
|
||||||
align-items: center;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
height: 100px;
|
width: clamp(23ch, 50%, 46ch);
|
||||||
width: 200px;
|
display: flex;
|
||||||
background: #fff;
|
flex-direction: column;
|
||||||
padding: 50px;
|
padding: 1rem;
|
||||||
border-radius: 10px;
|
|
||||||
position: relative;
|
|
||||||
text-align: center;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.illustration {
|
.illustration {
|
||||||
|
position: relative;
|
||||||
}
|
bottom: 10em;
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user