[x] Should the .menu element be a nonsemantics div or a rich semantic nav (commonly used for our main navigation)
[x] We need a nav and a h1 tags
[x] Menu items should be clickable
[x] Humanize text in alt attributes
[x] Remove empty footer.
CSS - selectors
[x] Class selectors are free, let's use them instead tag selectors
[x] Improve hierarchy adding more common styles to body tag as font-size, font-family, font-weight, color, background-color
CSS - box model
[x] There are some weird margins, let's remove them: Remember the browser add some margins to the <body> element; and Any time we set an absolute or fixed position on an HTML element we should also set a left/right and a top/bottom CSS properties so it will display properly
[x] Instead of adding extra space at the bottom of the header, you can make the menu links taller, that would make the header be tall enough and also would make the link easier to touch on mobile devices ;)
[x] Fix the main area, you have an extra white space at the bottom
[x] Your main element has some top padding, that's a solution to prevent the main title to disappear behind the fixed header but consider using min-height to do the trick ;)
Really cool job @saramarin23 !!!
Here you have some tips to improve the exercise:
HTML
.menu
element be a nonsemanticsdiv
or a rich semanticnav
(commonly used for our main navigation)alt
attributesCSS - selectors
body
tag as font-size, font-family, font-weight, color, background-colorCSS - box model
<body>
element; and Any time we set an absolute or fixed position on an HTML element we should also set a left/right and a top/bottom CSS properties so it will display properlymain
element has some top padding, that's a solution to prevent the main title to disappear behind the fixed header but consider using min-height to do the trick ;)CSS - other
Assets
./styles/main.css
.Good practices
Final remarks
Once you have these fixed try to finish the styles. Start with the header and go step by step:
Then repeat the same with main content.
Call to action
Let me know if you have any doubts ;)
Go for it!!