#1 Верстка сайта | Верстка сайта с нуля для начинающих

Адаптивная верстка сайта с нуля для начинающих HTML CSS
В этом видео я покажу и расскажу о верстке блока Header
Мы поговорим про HTML CSS верстку простого макета из FIGMA с кучей полезных решений и лайвхаков!
Верстка Header Часть 1

Полезные ссылки:

👉 Я верю - ты сможешь, у тебя получиться!

[moumoumoumou]

Продолжайте вашу роботу, есть еще много интересного объяснить нам, начинающим. Спасибо

[SerhiiKirov]

Кто учиться с нуля это лучший урок, автор обьясняет понятно уделяя внимание мелочам, материал заходит с большим интересом.
В кнопке назвал класс bnt хотя называешь его btn, в таком же виде скопировал его в css)

[tinyone]

Очень круто объясняешь, спасибо за твой труд!

[vadimkuis]

Очень хорошо обьесняете, хороший урок

[Edgar-pulc]

Лайк и подписка, надеюсь еще такие видео будут

[oqhtfco]

Продолжайте в том же духе!!!Все очень здорово!!!

[yuriyzadorozhnyi]

Дякую Вам Ілля за вашу нелегку працю і що даєте можливість навчатися безкоштовно, для початківців немає можливості все зразу оплатити, а потрібно не мало щоб все потрібне придбати . Дякую за такі доступні пояснення, навіть не очікував що стільки корисної інформації за одине відео для себе отримаю . Бажаю Вам завжди відчувати задоволення від того чим займаєтеся і достатку у всьому, будьте здорові ! Забув додати, для шрифтів, встановити додаток Font Fascia, зразу всі шрифти видно .

[RamonIPerez]

Привет! Только начинаю вникать в вёрстку. Спасибо за подробное и понятное разъяснение. Было бы круто сразу по БЭМ верстать

[maksym_kriukov]

Отлично объясняешь, очень доступно. Есть с чем сравнивать, это не первое видео по вёрстке, которое я смотрю. Вот со звуком только нужно вопрос решить

[isqmtdw]

49:00 ну вообще-то это неверное объяснение: одна точка обозначает текущую директорию, две точки - выход по иерархии на один уровень вверх (то есть в родительскую директорию), и уже потом слэшом и названием директории мы указываем, куда необходимо зайти. Очень важно для новичков (а я тоже новичок так-то) правильно указывать терминологию, иначе потом будут проблемы с пониманием материала.

[vzssctt]

Илья, привет! Подскажи мне пожалуйста, вот мне надо 4 блока поставить два блока друг по другу, подскажи какие использовать свойства в сss

[dmitrijloskutnikov]

У меня два вопроса.
1. Скорее уточнение, нежели вопрос. Ширина контейнера в проекте равна 1140px. Если левую границу выравнивать по элементам на странице.
Единственный элемент, который вылезает влево - это заголовок h1 на 12 px. Задумка это дизайнера или ошибка, не известно.
2. Исходя из первого пункта, навигация в хедере расположена ровно по середине этого контейнера. Если померить расстояния, то по 335px от границ контейнера. У вас же сверстано по центру между логотипом и кнопкой, что не совсем соответствует макету. Если кнопку, например, увеличить в длину, то навигация сместится влево. А она не должна никуда смещаться.
Можно ли прописать какое-то свойство в css для навигации, чтобы она заняла место по центру контейнера, не меняя основной структуры всего блока header__top.
Что-то вроде: .nav {
justify-self: center;
}
Так, увы не сработало.
Или сначала все три блока поставить по центру, а потом лого поставить слева, а кнопку справа?
Или лого и кнопку спозицианировать абсолютно по краям, тогда навигацию просто выровнять по центру header__top?
Самым логичным решением выглядит отстегнуть блок nav от участия в свойстве justify-content: space-between; и спозиционировать его отдельно по центру header__top . Но как это сделать?

*Update.*
В общем получилось с абсолютным позиционированием, но хотелось бы и без него, если это возможно.
.header-top {
display: flex;
justify-content: space-between;
position: relative;
}
.nav {
position: absolute;
left: 50%;
transform: translate(-50%);
}

И спасибо за контент.

[dykqshw]

Здраствуйте у меня вместо disign стоит comment что делать?

[vxutghl]

а почему отступы в меню с помощью gap не задать?

[zzhpfok]

Привет, сам новичек, ноне понял почемуне использовал gap в листе