Простые правила, которых следует придерживаться новичкам в 95% случаев:

Правило 1: используйте devtools.

Каждый современный браузер поставляется с набором devtools. Изучите и используйте его. Если вы посмотрите, как сделаны другие сайты, это поможет вам в первое время избежать многих простых ошибок.

1. Посмотрите, какой стиль CSS был применен

1. Обратите внимание на отступ, поля, границы, смещение любого элемента
2. Посмотрите, какие шрифты отображаются
3. Просмотрите, как будет выглядеть сайт на мобильной версии

Правило 2. Понимание CSS по умолчанию.

Код CSS - это набор правил оформления и форматирования, применяемых к HTML, для того, чтобы он выглядел хорошо.

Каждый браузер поставляется со своим набором правил по умолчанию. Вы должны учитывать их тоже. Они помогут объяснить разницу между вашей страницей в Firefox и Chrome.

Правило 3: два свойства CSS, которые должен знать каждый.

Существуют сотни (или даже тысячи) свойств CSS. Вы не можете выучить их все прямо сейчас, но большинство из них вам и не понадобятся.

Тем не менее, два из этих свойств вы должны знать точно:

DISPLAY и POSITION.

Если вы не очень хорошо понимаете эти два, остановите свое обучение и не приступайте к новым понятиям, пока не усвоите эти два на отлично. Потратьте столько времени, сколько будет нужно, но изучите их основательно.

Это сэкономит вам много времени в будущем.

Правило 4: Не используйте фиксированные высоту и ширину

Очень часто начинающие верстальщики используют width и height. Вы рискуете тем, что на больших экранах изображение будет слишком маленьких.

Это потому, что нужно использовать минимальный размер, а не фиксированный размер.

На самом деле в 95% случаев нужно использовать min-width, max-width и тому подобное. Всегда выбирайте наиболее гибкое решение. Таким образом, min-width как правило, будет лучше, чем width.

Правило 5: используйте правильные единицы.

Есть много единиц в CSS, но как новичок вы можете, как правило,  знать только em, % и px. Некоторые добавят vh, vw и rem, но в начале они вам не понадобятся.

Что вам действительно нужно, это разобраться, какой из этих трех ( em, % и px) являются наиболее приспособленными к ситуации. Одна ошибка здесь может стоить вам много.

Правило 6: сначала мобильная версия.

Все начинающие хотят начать верстку с десктопной версии. Но совет опытных верстальщиков - всегда начинайте проектировать сайт для смартфонов, затем переходите только к большим разрешениям.