#2 Адаптивная верстка сайта с нуля для начинающих | HTML, CSS, Figma | Секция banner

[@ВалентинаАхметзянова-ь4ю]

Это лучший курс, который я когда-либо изучала. Все четко, без воды, без рассусоливаний и практически без ошибок. Узнала много нового. Современная верстка. Спасибо Вам, Александр!!!! Так что изучу все, что у Вас есть. Я - Ваша преданная ученица! Наконец, у меня появилась уверенность, что у меня все получится.

[@AleksanderLamkov]

Спасибо за теплые слова! Если будут возникать затыки во время обучения, не стесняйтесь писать в чат: t.me/friendlyFrontendChat Там я и другие ребята постараются помочь 😊

[@ВалентинаАхметзянова-ь4ю]

@@AleksanderLamkov Спасибо большое! Я изучу все Ваши уроки. Попробую присоединиться в телеге. Мне часто не хватает совета профессионала, так что очень рада знакомству! У меня столько мусора в голове по верстке. Моя мечта стать профессионалом. Ну, или идти к этой вершине. :) Закончила этот курс, думаю, к какому перейти далее. Хочу подробнее познакомиться с БЭМом, так что пошла к Вашему курсу "Вёрстка сайта с 0 до результата | HTML, SCSS, БЭМ". Вся в предвкушении.

[@АндрейШтольц-л4ю]

Отличные уроки. По содержанию, вообще, выше всяких похвал!

[@svitboomer8840]

Хочу купаться в твоём контенте. Чувствую как мои hard skills растут

[@CoralLynx]

Большущее спасибо за контент 🙏 Наконец-то понял, как применять clamp на практике 😅 И про aspect-ratio просто пушка, теперь всегда буду это юзать) Ждем следующую часть! ❤

[@smotritelyoutube]

Супер!!! Жду эти уроки больше чем какой-то развлекательный контент. Ну просто супер, все четко, по теме, структурировано, дикция хорошая, все мысли заранее сформулированы, пушка!!! И наконец-то я понял какого х** у меня вечно li были выше чем содержимое, вообще не знал за эту тему, что у элементов списка свое свойство дисплей, автор молодец!!!

[@unlimitedgames8357]

Отдельное спасибо за min clamp Жду следующих выпусков

[@ИванТуманов-е2ш]

Еее. После первого же видоса заметно прокачался. В практическом плане это лучшие видосы по верстке! Спасибо, Александр.

[@biscvie]

Ждем еще уроков, спасибо) Сложновато правда, но стараемся)

[@АндрійЛємак]

не понимаю, почему так мало лайков, надо как то продвигать канал - реально цепляет

[@egorrublev5529]

Премного благодарен, за годный подробный контент. Александра Хотелось бы видеть чаще или дольше.

[@ИгОрЁк-л2з]

дольше не надо такое время видео самое оптимальное для обучения

[@egorrublev5529]

или выходили что бы 2 раза в неделю@@ИгОрЁк-л2з

[@AleksanderLamkov]

К сожалению, делать мастер-классы чаще с такой же концентрацией информации пока физически не получается 😕 Сценарий, разработка, съемка, монтаж - съедают уйму времени. А записывать без подготовки и выпускать контент без монтажа - точно не хочу :)

[@1gos]

Очень круто! Узнал много удобных вещей! Спасибо!

[@Tehnokrott]

Саша - красава! Ну как же красиво ты всё делаешь. Просто получил эстетическое удовольствие как ты верстаешь: внимание к мелочам, подробное объяснение, прям как я мебель. Хочу такой же подробный и понятный курс по мебели сделать)

[@sv2234sv]

Спасибо, очень интересно и очень полезно!

[@Alex-y3n9s]

Александр, супер 👍 Особенно за семантику отдельный лайк. Не хочу душнить, но думаю было бы полезно упомянуть ещё про переполнение контента. К примеру в блоке баннера, если породублировать сейчас текст и уменьшить экран по вертикали, то текст будет выходить за границы блока (если я все правильно заметил). Я обычно высоту полноэкранного блока также ограничиваю с помощью clamp или хотя бы min-height: max(700px, 100vh)

[@AleksanderLamkov]

Привет! При текущих стилях учитывается переполнение контентом, верстка не сломается. Если продублировать текст много раз, секция займет столько высоты, сколько ей потребуется. Верстка поломалась бы только, если бы вместо свойства min-height мы использовали height.

[@Alex-y3n9s]

​@@AleksanderLamkovвот это я как раз и проглядел) сорри А скажи, пожалуйста, стоит ли ограничивать по максимальной высоте? На 4к экранах, к примеру, нормальная практика оставлять блок на всю высоту или лучше "прибрать"?

[@AleksanderLamkov]

Хм, лучше это учесть, как раз функция min поможет. Спасибо за идею! min-height: min(1080px, calc(100vh - var(--header-height))); Допустим, на экранах высотой 1080px и больше, минимальная высота будет не больше 1080px.

[@Alex-y3n9s]

@@AleksanderLamkov Посмотрел свой рецепт😁 Если упростить то так делал - min-height: clamp(700px, 100vh, 1100px);

[@sleepyNovember_project]

Красотища, контент который просто приятно смотреть, неважно, понимаешь всё, или не всё😅

[@ВладЛитвин-с6д]

Отличные уроки, видно что немаленький опыт, продолжай в том же духе и соберёшь лям подписчиков)

[@mushroom2267]

Было бы здорово ещё увидеть небольшой мастер-класс по гиту и его ключевым возможностям

[@AleksanderLamkov]

Привет! Разве что действительно "небольшой" :) Уж слишком много возможных сценариев при работе с гитом...

[@mushroom2267]

@@AleksanderLamkov разумеется) Гит полезнейший инструмент и мастхэв в разработке, но для многих это настоящее препятствие осилить его изучение. А ты как раз делаешь ёмкие по содержанию, но не перегруженные ненужной информацией видео, что делает их уникальными по ценности материалами. Гит сюда бы идеально вписался.

[@Kolobaka266]

Спасибо вам большое за ваши видео, очень многим моментам научилась у вас, очень понятно объясняете, у вас талант доносить информацию 🤌

[@miterevv]

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

[@w0rsttttt]

Ваш канал - просто находка. Хотелось бы узнать, будет ли подробнее разобрана SEO оптимизация?

[@AleksanderLamkov]

Привет! К сожалению, нет. Я в SEO не разбираюсь, если не считать рекомендаций о семантике. Там ведь целый мир метатегов и микроразметки, на изучение этого нужно немало времени.

[@megashield_og]

хороший урок, хочется больше небольших объяснений на разные моменты

[@AleksanderLamkov]

Привет! Задавай вопросы, я на всё отвечу. Или можешь написать в телеграм, там я или другие ребята помогут: t.me/friendlyFrontendChat

[@itobold]

Спасибо большое за труд. С размерами с макета понятно(там все четко), но вот когда ты произносишь: "предположим значение будет столько то, давайте у нас будет столько, я бы сделал вот столько" хотелось бы минимум информации, чем ты руководствуешься, что бы научится думать в правильном направлении. Если я правильно понимаю, если нет дизайна адаптива на мобилки, то нужно просто руководствоваться читабельностью и соблюдением пропорций? Но на боевой, если заказчик будут требовать адаптив, без дизана согласованного, лучше не верстать?

[@AleksanderLamkov]

Привет! При адаптации руководствуюсь логикой и чувством прекрасного :) И самое главное - на уровне кода стараюсь не делать костылей, поэтому, если даже макет к ним вынуждает, частенько отклоняюсь от параметров макета и делаю «хорошо на уровне кода», сглаживаю неровные значения, агрегирую разнящиеся свойства однотипных компонентов во что-то унифицированное. Вообще, как только поверстал непрерывно около года на первой работе, то процесс адаптации у меня теперь всегда на интуитивном уровне работает. А по поводу «заказчик требует адаптив, но в макете адаптива нет» - я в принципе против того, чтобы дизайнеры делали адаптивные версии сайтов в макетах, так как зачастую нам, разработчикам, потом страдать, вставляя костыли там, где можно было бы обойтись без них. Дизайнер - не разработчик и не знает, как его детище будет выглядеть на уровне кода. Дизайнеру зачастую плевать на то, что для реализации интерфейса мобильной версии сайта разработчику придется буквально полностью перекраивать разметку и перебивать множество правил стилей. Ну а если опытный разработчик адаптирует сам, то он понимает, как с минимальными (!) усилиями и минимальным количеством дополнительного кода адаптировать всё так, чтобы и конечному пользователю было удобно, и сам сайт не страдал по перформансу от костылей. В общем, верстать макет без нарисованного адаптива - кайф. P. S. Если дизайнер опытный и есть дизайн-ревью (в крупных серьезных компаниях такое может быть), то макет и адаптив может быть адекватным, но на своей практике из сотни макетов я видел таких очень-очень мало.

[@miterevv]

@@AleksanderLamkov Спасибо за такой прекрасный контент и огромный ответ на вопрос в комментарии. Я если честно первый раз вижу такой развернутый комментарий от автора. Вы однозначно уникальный и очень ценный человек. Благодарю, хоть вопрос и не мой был но в вашем ответе открыл новое знание.

[@m.manukian]

ну просто красавчик

[@IvanKeats-q3q]

0:50 1:30 1:55 3:35 7:34 8:01 8:35 11:50 12:42 15:08 15:50 16:26 17:40 18:35 19:35 20:00 20:40 21:48(22:06) 22:56 27:55 29:00 29:33

[@OkazakiTomoyasan]

топ😎

[@OnlyProg-dm9gc]

Спасибо за урок! Ды ты волшебник вёрстки в моих глазах))

[@ИгОрЁк-л2з]

Хорошо что не растягиванете видео на часы, а то некоторые делают видео больше часа и потом эффект такой что пока до конца досмотрел уже забыл с чего начиналось как результат бесполезно потраченное время.

[@Bit_Maximum]

Спасибо

[@neilhackgamer5941]

Круто! Александр, можете ли вы сделать видео по настройке IDE Webstorm, просто интересно какие у вас сниппеты, настройки в целом?

[@AleksanderLamkov]

Привет! Настроек на самом деле минимум: - разлочил возможность зумить масштаб текста колесиком мыши; - поставил плагин темы Oceanic Dark Theme; - настроил сниппеты под некоторые HTML-теги, чтобы, например, тег кнопки разворачивался сразу с заполненным атрибутом type="button", чтобы тег изображения разворачивался с атрибутами alt, width, height и loading="lazy" и т. п. Вот пишу этот коммент и понимаю, что видео на эту тему было бы действительно полезно новичкам. Может ещё каких неочевидных полезностей накопаю… В общем, спасибо за идею! Возьму в работу :)

[@neilhackgamer5941]

@@AleksanderLamkov супер!

[@skro1ik410]

Я поставил размер слова crossfit 360 px и оно у меня в экран не влезало,а у тебя наоборот.Это из-за монитора,или как?

[@pablo_barnes7329]

Топ

[@natanatalie987]

Очень полезные уроки по вёрстке! Получается, h1 должен содержать название, которое бы понятно озаглавило всю страницу. Нельзя обернуть слово Crossfit в этот тэг, выходит?

[@AleksanderLamkov]

Угу, верно, слово "Crossfit" плохо подходит для главной страницы фитнесс-клуба, оно неинформативно.

[@MsDlovar]

Отличный контент, спасибо. Мне очень понравился трюк с кружочками у пагинации слайдера через псевдоэлемент и расширение зоны клика у кнопок. Есть один вопрос, сейчас высота шапки задана в 90px и высоту секции banner считаем через формулу calc(100vh - var(--header-height)). Все хорошо пока шапка не становится в два ряда на узких экранах, там ее высота получается уже 92px и мы получаем вертикальный скрол на эти самые 2 пикселя. Я понимаю, что это сейчас легко исправить уменьшив горизонтальные отступы в шапке. Но бывают же ситуации, когда высота шапки радикально изменится от ширины экрана, и там уже такой костыль не прокатит. Как в этом случае быть? Надо чтобы в calc(100vh - var(--header-height)) поставлялась не константа-переменная а динамическое значение реальной шапки. И еще вопрос, всегда было интересно как верстают сайты в которых общий фон (предположим картинка) у блока header и и к примеру первой секции блока main. Получается у главной навигации сверку сайта и первой секции героя один и тот же фон. Их что в одну обертку оборачивают? Тогда получается обертка начинается в header а заканчивается в main, так можно делать? Еще раз спасибо за ваш труд!

[@AleksanderLamkov]

Привет! > Но бывают же ситуации, когда высота шапки радикально изменится от ширины экрана, и там уже такой костыль не прокатит. Как в этом случае быть? Тут потребуется JS, чтобы вычислять динамически высоту элемента шапки для значения переменной --header-height: const rootElement = document.documentElement const headerElement = document.querySelector('.header') const saveHeaderHeight = () => { rootElement.style.setProperty('--header-height', headerElement.offsetHeight) } saveHeaderHeight() window.addEventListener('resize', saveHeaderHeight) > И еще вопрос, всегда было интересно как верстают сайты в которых общий фон (предположим картинка) у блока header и и к примеру первой секции блока main. Получается у главной навигации сверку сайта и первой секции героя один и тот же фон. Их что в одну обертку оборачивают? Тогда получается обертка начинается в header а заканчивается в main, так можно делать? Общие обертки не нужны. Просто можно сделать для шапки position fixed или absolute и поместить в верхний левый угол, растянув на 100% ширины. Таким образом шапка наложится под весь остальной контент, в частности - на баннер.

[@MsDlovar]

@@AleksanderLamkov спасибо за развернутый ответ, теперь я понял. У вас большое будущее на KZbin.

[@mouri_san]

спасибо!

[@салбиевруслан-с2г]

Александр, спасибо вам за ваши уроки, все бесподобно! Помогите с проблемой: при добавление нового css-свойства к списку уже существующих, ниже стоящее свойство инактивируется. А когда ставлю новое свойство в конец списка оно само неактивно

[@AleksanderLamkov]

Напиши с кодом в чат: t.me/friendlyFrontendChat Там тебе помогут.

[@ЕленаГунина-ш6э]

Александр, уточните, пожалуйста, в чем преимущество применения псевдокласса для стрелки 14:14, можно ли было просто вставить svg ? Спасибо за ваши уроки!

[@AleksanderLamkov]

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

[@ЕленаГунина-ш6э]

@@AleksanderLamkov спасибо)

[@yaroslavviktorovich4644]

В html5 порядок заголовков в документе не имеет значения, имеет значение уровень вложенности.

[@skro1ik410]

19:35 Я размер родительского объекта( li ) увеличил и область нажатия на кнопку увеличилась.Так можно сделать?

[@МихаилАнтонов-к6ч]

Добрый день. Насколько я знаю скрытый контент (заголовки) может негативно повлиять на seo(серое seo) + текст всегда может попасть в сниппет (если он не оптимизирован). Просто наблюдение. Хотя это больше вопрос к целям страницы и необходимости в оптимизации.

[@AleksanderLamkov]

Так если заголовок скрыт визуально, то на SEO это не влияет. Мы же не через display none это делаем.

[@skro1ik410]

19:35 Я размер родительского объекта( li ) увеличил и область нажатия на кнопку увеличилась.Так можно сделать?Просто я так сделал и при наведении на li меняется курсор как и при наведении на button.Так работать будет или нет?

[@vahanarushanyan6296]

Спасибо за контент, и пожалуйста не подскажите разницу display: flex и display: inline-flex

[@AleksanderLamkov]

Элементы с display flex займут по ширине все доступное им пространство, а элементы с display inline-flex по ширине займут ровно столько места, сколько этого требует внутреннее содержимое.

[@vahanarushanyan6296]

​@@AleksanderLamkovСПАСИБО БОЛЬШОЕ

[@ПатрицияКомсомольская]

Александр добрый день! Спасибо вам за ваши видео! Подскажите в чем у меня ошибка, banner - min-height: calc(100vh - var(--header-height)); на ширине 1920 высота секции встает в размер 500 примерно и + паддинги но до макетной высоты не дотягивает, вроде все посмотрела на предмет ошибок. Можете подсказать в чем может быть проблема пожалуйста?

[@AleksanderLamkov]

Добрый! По одному сообщению сложно понять, в чем проблема. Напишите в чат: t.me/friendlyFrontendChat Там помогут разобраться. Ну или сравните сами свой код с кодом из репозитория (ссылка на него есть в описании под видео).

[@ПатрицияКомсомольская]

@@AleksanderLamkov спасибо напишу в чат, код сравнила конечно все тоже самое может быть что то упускаю

[@Тимур-ф4к9м]

спасибо вам за курс. кто подскажет? в тексте New event coming up / june 7 - 13 тег br почему то не работает New event и coming up слиплись,как это исправить?

[@AleksanderLamkov]

Напиши сюда: t.me/friendlyFrontendChat Там ребята тебе помогут.

[@offernity2707]

не очень поняла почему кнопки пагинации резко быстро перенесли в псевдоселектор after

[@AleksanderLamkov]

Не кнопки пагинации перенесли, а только их основную стилизацию. А у селектора основного элемента прописаны стили, дающие дополнительное пространство, чтобы на кнопки было удобнее нажимать.

[@offernity2707]

@@AleksanderLamkov я неправильно выразилась, так все-таки для чего нужен псевдоэлемент в данном случае и что будет если его не использовать?

[@AleksanderLamkov]

Он нужен для того, чтобы расширить границы элемента, чтобы кнопка была больше и чтобы она удобнее нажималась. Если бы псевдоэлемент не использовали и все свойства разместили в селекторе .button-pagination-button {}, то кнопки бы не соответствовали макету.

[@itobold]

По поводу халтуры дизайнера и пагинации, там если в режиме дизайнера посмотреть то видно черточку между элементами(если ее подвигать то это окажется как раз гэп судя по всему), очень забавно как ты с первого раза угадал значение 14 px(тупа на опыте) ну или посчитал пиксели) короче видимо фигма этот момент продумала.

[@AleksanderLamkov]

Да, ты прав! Спасибо, что заметил. Перепроверил в режиме дизайна, там отдельно 3 «буллета», зря я тут уколол дизайнера. Фигма очень уж странно в дев режиме объединила всё в один слой, не знал, что такое бывает. Ну а пиксели, да, я посчитал «на глаз» :)

[@sv2234sv]

​@@AleksanderLamkov Или так: общая ширина известна 56px, высота круга 10px, три круга по ширине это 30px, между ними два интервала, 56-30=26 / 2 = 13px 😃

[@Александр-г1ч1э]

Не могу понять почему у меня в h3 текст вылазит за пределы блока. Что я не так сделал?

[@AleksanderLamkov]

Привет! В описании под видео есть ссылка на гитхаб, там код можешь мой посмотреть и сравнить со своим. Если не найдешь сам - пиши в чат t.me/friendlyFrontendChat, поможем.

[@akylbekbaizakov]

👍

[@ВиталийДавыдов-э4г]

Многие в видео-уроках предлагают хедер, майн, футер упаковывать во врапер. Это избыточно? Вы не используете.. Вы работаете в вк? Вы в видео даёте по стандартам вк?

[@AleksanderLamkov]

Привет! Обертка wrapper зачастую избыточна. Всё, что задают во wrapper, можно прописать и для body. Да, я работаю в ВК. Компания большая и общих стандартов по фронтенд-разработке у нас нет, как и в большинстве крупных компаний. Я в первую очередь делюсь личной экспертизой, которую накопил за последние годы работы в разных местах на разных проектах.

[@ВиталийДавыдов-э4г]

@@AleksanderLamkov Спасибо. Сложно, но интересно.

[@Principal19911]

Странно, почему VS Code не выделяет цветным aspect-ratio, все остальные свойства цветные (синие), а он белый. Приемный что ли?

[@AleksanderLamkov]

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

[@Principal19911]

@@AleksanderLamkov Понятно, спасибо за ответ.

[@TeomunMete]

Здравствуйте и спасибо за контент . Когда я задаю h3 360px тут же вылазить за предел контента .а с min() без проблем работает

[@AleksanderLamkov]

Привет! Спасибо за обратную связь :) Да, так и должно быть, функция min и vw-значением внутри спасает в ситуациях, когда текст начинает выпирать за пределы экрана.

[@vehiclesport662]

Слишком быстро говорите), а так все круто, поплыл на стрелке , она не прижимается к crossfit :D

[@AleksanderLamkov]

Привет! По скорости скорее всего из-за особенностей монтажа так кажется. Оцените потом следующий мастер-класс (уже вышел на канале), там иначе поработал на монтаже с темпом, больше естественных пауз, должно восприниматься лучше :) По поводу проблемы со стрелкой - напишите в чат t.me/friendlyFrontendChat, скиньте архив с текущим состоянием проекта, кто-нибудь или я сам через пару часов смогу вам помочь.

[@alexandergerasimenko3026]

А разве это называется адаптивной версткой? Это же респонсивная верстка сайта. Позновательно с CSS функциями

[@AleksanderLamkov]

А это важно?) Я пятый год в этой сфере и до сих пор не знаю отличий между этими двумя понятиями. Всегда называл такую верстку адаптивной, т. к. она адаптируется под различные ширины экранов.

[@alexandergerasimenko3026]

@@AleksanderLamkov Да. Это крайне важно т.к. это принципиально разные подходы. Адаптивная подразумевает создание нескольких макетов под заранее определенное разрешение(устройство) и в зависимости от того на каком устройстве открывают, тот макет и подгружается . Респонсивная работает один макет на медазапросах (то что у вас)

[@AleksanderLamkov]

Не понимаю. То есть в адаптивной верстке нет медиазапросов и на каждую версию устройства (мобильная, планшетная, десктопная) подгружается отдельная версия сайта? Типа как vk.com и m.vk.com?

[@alexandergerasimenko3026]

@@AleksanderLamkov Я знаю это только в теории, и мне интересно было как адаптивная верстка реализована на практикие. Почему и начал смотрет ваше видео). Адаптивная предполагает создание нескольких макетов, жестко закрепленных, под соответствующее устройство (диапазон разрешений). Я думаю, что скрипт определяет устройство(разрешение устройства) и загружает соответствующие стили / макет.

[@AleksanderLamkov]

Хм. Мне не кажется такая схема правильной. Если скриптом определять, какой файл стилей грузить, то наверняка процесс применения стилей будет с неприятным визуальным скачком интерфейса.

[@maxim-147]

Нельзя скрывать заголовок h1 можно легко бан словить от поисковика, это называется клоакинг

[@AleksanderLamkov]

Этот вопрос всегда был спорным, разве нет? То сеошники говорят можно, то нельзя. Или появилась какая-то новая информация? Если да, то можешь поделиться источником, пожалуйста?

[@mikhailkaras7411]

А это точно для новичков, или я такой тупой)))

[@AleksanderLamkov]

Привет! А с чем именно возникли трудности? Я постарался объяснить каждый момент. P. S. Если не смотрел курсы по HTML и CSS на моём канале, советую с ними ознакомиться перед этим мастер-классом. Там разжевывал буквально всё, о чем вещаю в текущем видео 🙃

[@skro1ik410]

19:35 Я размер родительского объекта( li ) увеличил и область нажатия на кнопку увеличилась.Так можно сделать?Просто я так сделал и при наведении на li меняется курсор как и при наведении на button.Так работать будет или нет?

[@skro1ik410]

Я поставил размер слова crossfit 360 px и оно у меня в экран не влезало,а у тебя наоборот.Это из-за монитора,или как?

[@LAMit]

У меня тоже так было. Макет с разрешением 1920px. На мониторе с меньшим разрешением нужно уменьшить масштаб

[@skro1ik410]

@@LAMit понял

[@skro1ik410]

19:35 Я размер родительского объекта( li ) увеличил и область нажатия на кнопку увеличилась.Так можно сделать?

[@AleksanderLamkov]

Нет. Нужно увеличивать область нажатия самого интерактивного элемента, то есть ссылку.

[@skro1ik410]

@@AleksanderLamkov Понял.А еще вестка по шаблону будет?По другому

[@AleksanderLamkov]

Будет, но после курса по JS.

[@skro1ik410]

@@AleksanderLamkov хорошо,буду ждать

[@skro1ik410]

​@@AleksanderLamkov Просто я так сделал и при наведении на li меняется курсор как и при наведении на button.Так работать будет или нет?

[@skro1ik410]

Я поставил размер слова crossfit 360 px и оно у меня в экран не влезало,а у тебя наоборот.Это из-за монитора,или как?

[@AleksanderLamkov]

Что-то твои комментарии аж по три раза дублируются. Если элемент с текстом с теми же стилями, что и в видео, у тебя выглядит не так, то скорее всего проблема в font-family, наверняка у тебя шрифт не тот отображается.

[@skro1ik410]

19:35 Я размер родительского объекта( li ) увеличил и область нажатия на кнопку увеличилась.Так можно сделать?Просто я так сделал и при наведении на li меняется курсор как и при наведении на button.Так работать будет или нет?

[@AleksanderLamkov]

Нет, стоить увеличивать область нажатия именно интерактивного элемента, а не .

[@skro1ik410]

@@AleksanderLamkov последний раз спасибо