2 answers
You have a css code on the screenshots, which then as a result at the later stages of development will drive in you not that into a corner, but into the abyss , from which you cannot get out without rewriting everything completely!
Do not use ids. Apply styles only to classes, for example
.header{}. Weight identifiers above classes. You cannot then redefine styles from an identifier as a class without resorting to various bad practices!Do not get carried away with the insertion of
header #logo img{}elementsheader #logo img{}unnecessarily. So you give the selector too much weight, which you will not be able to override later on without writing a similar construction later. Think for yourself, why did you describe such a triple nesting?Do not group items separated by a comma, even if they seem to have the same style according to your idea, especially if the elements are not interconnected within a block on the page. So you ask the selector again a lot of weight that you cannot override. Or you want to change the color in one block later and you can not, you'll see.
The answer is off topic, it was just scary for you. Read, for example, about the weight of selectors and BEM , so that in general there was a presentation.
How to align text vertically?
Missed
display: inline-block; And in the font-family some rubbish.
