Elements

Question

This code is my first project of a web and some elements confuse me, the header didnt touch the
top, and the footer bgcolor didnt spread
https://code.sololearn.com/WleNil2w1otw/?ref=app,any advice and tips greatly appreciated.

Answer 1

1. Fix :

https://code.sololearn.com/WGgn7xfbve4k/?ref=app

2. Problem 1

line 22 and 33 (of my edit)

the margin-top of header class and the 'top' of your span are pushing the header text down, so I removed them.

there is still space because you used h2, you can use change to use div if you don't want any space at all.

3. Problem 2

line 63 (of my edit)

the page background and footer background are both dark, so 0.5 opacity is not enough.

I changed to a lighter footer background and tuned down the opacity, so now you can see the transparency.

4. Footer position

Don't top95vh for footer, I changed to bottom 0 with position fixed.

5. You should begin with the whole layout in mind, read my tutorial from beginning to end:

https://code.sololearn.com/W3gS00IGw160/?ref=app

Answer 2

Thank you