scrimba
Kodekurs for ungdoms- og videregående skoler
Lag et spill med HTML, CSS og JS
Regnemesteren #3 - Animasjon med CSS og litt JavaScript
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Regnemesteren #3 - Animasjon med CSS og litt JavaScript
AboutCommentsNotes
Regnemesteren #3 - Animasjon med CSS og litt JavaScript
Expand for more info
index.css
run
preview
console
* {
box-sizing: border-box;
margin: 0;
}
html {
font-size: 100%;
}
body {
background-color: #eee;
font-family: 'Roboto', sans-serif;
text-align: center;
}
#game {
width: 25rem;
margin: 1rem auto;
background-color: white;
}

header {
display: grid;
grid-template-columns: 1fr 1fr;
background-color: salmon;
color: white;
padding: 0.25rem;
}
header section {
justify-self: start;
}
header section:last-child {
justify-self: end;
}

header label {
font-weight: 300;
}
header p {
font-size: 2rem;
font-weight: 700;
}

main {
position: relative;
height: 25rem;
background-color: lightgreen;
}

#divRegnestykke {
position: absolute;
font-weight: 500;
color: #888;
background-color: blanchedalmond;
width: 12rem;
height: 4rem;
padding: 1rem;
font-size: 2rem;
left: calc(50% - 6rem);
top: 2rem;
}

footer input {
width: 100%;
font-size: 2rem;
padding: 0.5rem;
text-align: center;
}
footer input:focus {
outline: none;
}
Console
index.html
-8:36