Kevin Powell - Community•2y ago

header height

Good day everyone. Some confusion abt this project: https://github.com/bedimcode/responsive-halloween-website/blob/main/index.html

media screen and (min-width: 767px)
.nav {
    height: calc(var(--header-height) + 1.5rem);
}

media screen and (min-width: 767px)
.nav {
    height: calc(var(--header-height) + 1.5rem);
}

why header height is 100px?

var(--header-height)

var(--header-height)

is 3 rem; shouldn't the header be 5rem (80px)? I didn't see top bottom padding or margin. What am I missing? Thanks!

GitHub

responsive-halloween-website/index.html at main · bedimcode/respons...

Responsive Halloween Website Design Using HTML CSS & JavaScript - responsive-halloween-website/index.html at main · bedimcode/responsive-halloween-website

3 Replies

glutonium•2y ago

3×16 + 1.5×16 = 72px should be 72px is your query working properly

redtypoOooOoOP•2y ago

sorry there is a typo. --header -height is 3.5 rem;

redtypoOooOoOP•2y ago

when i inspect, it shows the nav height is 100px; not sure where is the problem

Gaming

Programming

header height