Hello,
I’m having trouble getting ‘main’ pushed down from the top of the height of the #navbar as explained below. Please help. Thanks.
https://www.codecademy.com/practice/tracks/learn-css/modules/learn-css-display-positioning
Created by: Pyllo
Oh no! You spent days creating this awesome blog static website but now your client wants the navigation bar fixed at the top of the screen. You only have a minute to sort it out before final presentation - what are you going to do? Your #navbar has the height of 100px exactly.
2
3
4
5
}
6
7
}
8
9
10
11
12
13
14
15
16
17
#navbar {
/* High z-index to ensure that #navbar is
always in front of other elements: */
z-index: 5;
/* CSS property ensuring #navbar always
stays in the same place even if the page is
scrolled: */
position: fixed;
}
main {
/* Ensure the remaining content doesn’t hide
behind the #navbar: */
overflow: scroll;
position: absolute;
top: 70px;
bottom: 0;
}
Run
Check answer
And now, how can you push <main> down from the top exactly the by the height value of the #navbar?
1/3
checks left
Next