Hi Richard,
Great work. Your page is coming along nicely.
Here are a few issues that I’m noticing:
I see your fixed header is overlapping with the content right below. You can probably fix that by adding some margin-top or padding-top to your div with the id of initial-tag.
It’s convention to use classes instead of IDs when selecting elements to style with css. Using IDs is going to really limit you in styling a bunch of elements in the same way. (ID is a unique identifier).
Your logo’s aspect ratio looks off. I think you can fix that by setting the height of the logo to whatever you want and setting its width to auto. You might want to do that in the CSS as opposed to inline in the html.
I would also suggest adding a font with the font-family css property. The default font looks low effort.
I hope that helps! I look forward to seeing your progress.
Thanks I learned a lot from your feedback!
What do you think about it now?
Also,
I’m not sure what you mean about the class being easier to style than ids.
Hi Richard, It’s looking much better!
What I’m trying to say with classes vs IDs in CSS.
You can put the same class on multiple elements in your html and style them all the same way.
So instead of giving each element a unique ID that only allows you to select that one element in the CSS, you can give the same class to many html elements and then style them all in the same way in the same CSS rule. You did this with your .nav-links class.
Using IDs is too specific and not reusable. IDs are mostly useful for selecting DOM elements in JavaScript. You can use them in your CSS, of course, but I would encourage you to get into the habit of using classes instead.
If IDs are too specific, using the html tag-name to select elements in CSS is too broad. As with using IDs, you can do it, but be careful because you may target elements you didn’t intend to, especially in larger projects.
Now in your project you have a lot of divs with IDs and there are some bugs and unnecessary repetition in your code as a result of this.
You’re targeting the #header id twice in your CSS. The cascading nature of CSS is making it so that the first set of #header rules are being overwritten by the second set.
The only way to learn this is by trial and error. You’re doing great, the page looks about how you want it. The end user can’t see your code, but, making your code conform to conventions will make it easier to maintain in the future, and also easier for other devs to contribute to your projects.
Please let me know if I can clarify any points.
Best,
Lisa