Nozuchi / teacozy

Tea Cozy project
0 stars 0 forks source link

Header css #2

Open farishkash opened 6 years ago

farishkash commented 6 years ago

I am focusing on these 3 styles in the header css.

  top: 0px;
  left: 0px;
  right: 0px;

I am assuming you did this to fix the gap that was up on top.

The gap is easily fixable without having to use any positioning.

All web pages have a default margin for body. For example Google Chrome gives it a margin 8px.

In your css if you set the body to a margin 0px; The spacing is removed for the whole site.

Your solution only fixed the header and can cause centering issues for other elements.

If you use developer tools and inspect the body you will see the margin all around the page.

farishkash commented 6 years ago

Just noticed this comment, yes this is why your footer was off.

footer {
  /* The footer was always offset by 6 pixels. Wasn't sure how to fix this. */
  padding: 20px 0px 20px 14px;
  text-align: left;
}