Learn CSS Transforms by Building a Penguin - Step 104

HTML-CSS
#1

I try to solve this step:
calculate the height of the .ground element to be the height of the viewport minus the height of the .penguin element.

But i get this error:
You should give .ground a height of calc(100vh - 300px).

My code is below

.ground {
width: 100vw;

background: linear-gradient(90deg, rgb(88, 175, 236), rgb(182, 255, 255));
z-index: 3;
position: absolute;
margin-top: -58px;
height:calc(100vh -300px);
}

#2

Can you give us the link to the problem?

#3

HI @Evaggelia ,

Correct me if I’m wrong but, In order for the calc() function to work, you need to have spaces around the dash or plus sign.

Try this

calc(100vh - 300px)

it shouldnt be
calc(100vh- 300px)
nor
calc(100vh -300px)
nor
cal(100vh-300px)

3 Likes
#4

Css is very sensitive.Thank you for the help.It’s work!

#5

It has strict syntax, but it is not that strict :+1: