Это лучший канал по вёрстке! Тупо как кофе пьешь и кайфуешь, самое топовое , что Вадим объясняет прям простыми словами , прям вот клянусь красава 💪🤝🔥! Спасибо Вадим за всё, всем советую твою канал! Здоровья тебе ✊
Я чекав цю тему як манну небесну, дякую наперед навіть ще не подивився а вже вподобайка)) А вот за пояснення ,що ж таке Flex-basis окреме величезне дякую. Я думав що це просто замість width.
Спасибо за материал, хорошая подача, легко и с юмором 👍. То чего многим блогерам не хватает. Также рекомендация по flexbox играм: жабки по началу весёлые без спору, но вот Flexbox Zombies - уровень поинтересней будет, больше практики и лучше "навык" отточит (там также есть игры по grid-ам и другие).
Salam Aleykum из Баку! -Спасибо большое за ваши видеоуроки ! Всё понятно ,всё четко ... Приятно слушать ! Дай Бог крепкого здоровья вам и вашим близким !!!
Новый видос пушка!!!! Вадим просто разрывает всем кабины своим топовейшим контентом!!!! Продолжай и дальше радовать нас, лучшими выпусками, т.к. это для тебя, как минимум будет отвлечением от всех бед, а как максимум - позитив и благодарочка от нас
Спасибо большое за видео. Это третье видео которое смотрю на эту тему. Подача супер, шутки тоже очень смешные. Продолжайте это дело обязательно) Всё очень даже не сложно, чтобы обобщать эти флексы, как делают это в интернете...
Мужик, спасибо тебе большое за контент особенно в текущей ситуации и что продолжаешь делать на русском ! Желаю твоим друзьям, близким и знакомым самого лучшего ! П.С. и вообще всем людям всего самого хорошего!
Вадим, безмерная благодарность за полезные, эффективные и позитивные уроки. Огромная просьба распихать их по возможности по плейлистам, так намного удобней искать на канале нужное
это конечно классная тема, спасибо! но вот еще бы разобраться с position: ... они летят куда хотят. порядок если навести, было бы агонь в будущих видосах
спасибо автору, за внятное к тому же интересное объяснения. баланс шуток и кода отличный, так намного приятнее и легче усваивать материал. удачи в росте канала)
Спасибо, это было чудесно и очень интересно! Игра с лягушатами -- милота =)) C удовольствием буду посещать данный канал, чтобы узнать что-то новенькое 😊
Видос, ответивший на многие мои вопросы. На днях мучалась, делала таблицу на флексах, и вот теперь дошло, что flex-grow и flex-shrink совсем не по назначению использовала. А flex-basis, кстати, правильно, я молодец. Дайте сюда слюнявого эксперта, я ему объясню, что флекс-бейзис - ширина флекс элемента вдоль ГЛАВНОЙ оси 😉
Лайк не глядя! Хотя, конечно же, посмотрю. Вадим, спасибо тебе огромное, что продолжаешь пилить видосы в это нелёгкое время! С твоего первого курса обучился вёрстке ещё летом 2019, потом уже без тебя JS (ждали от тебя, но недождались), сейчас работаю разработчиком на nuxtjs, но и там без вёрстки никуда! Ты на мак перешёл?)
как я примерно запомнил это все: flex-grow считается как: Находим сумму всех коэффициентов (flex: 1, flex: 2 и т.д). Далее берем отдельный элемент, например с flex-grow: 2 и считаем, как разность между коэффициентом растяжения этого элемента и общей суммой всех коэффициентов. И умножаем это все на свободное пространство, так мы получаем размер этого элемента с учетом flex-grow. С шринк такая же формула, но уже вместо свободной ширины используем оставшуюся после сужения ширину родительского контейнера. После подсчетов получим то, что нужно отнять от ширины родительского контейнера. эти формулы в целом безполезны, но если много гровов и шринков с 2 3 2 1 3 и так далее, то может помочь
Отличные видосы про флексам! Единственное что не упомянул, так это gap во флексах, ведь ими можно задавать конкретные расстояния между элементами, но та пофиг)
Привет Вадим, рад слышать тебя и то что ты продолжаешь тему по верстке! Хочу выразить свою благодарность по поводу своего обучению в вашем онлайн курсе Верстка 1.0. Спасибо огромное!!! Желаю ВАМ Мира, здоровья и счастья ! С уважением ваш ученик Олег из Молдовы!
Вадим, ты очень добрый и светлый человек. От тебя исходит позитивная энергетика, не смотря на весь ужас, который происходит в твоей стране😢 P.S с флексами разобрался, очень упрощают жизнь, а вот с гридами не могу. Даже циклы в JS дались проще. Может, потому что я пытаюсь микросетку построить на гридах, а следовало использовать флекс? Если кто знает, напишите, пожалуйста!
Лучше не напоминать человеку о происходящем, оставьте это для других блоггеров. Он отличился своим целомудрием и адекватностью к происходящему. По крайней мере, он просто продолжил делать то, что он делал. За это ему большое человеческое спасибо!
Если я правильно понял, мы изначально задаём флекс-элементам нужные нам ширины через флекс-бэзис. В случае, если мы хотим растянуть их на всю ширину главной оси контейнера (или высоту, если главная ось - column), то мы пишем каждому элементу одинаковый гроу. Если же нужны разные пропорции растяжения элементов, то эти пропорции вычисляются от оставшегося пустого места контейнера. Т.е. это пропорции именно РАСТЯЖЕНИЯ, а не пропорции занимаемых ширин элементов в контейнере по итогу этой операции. Я так понимаю, в случае верстки дизайнерского проекта вместо гроу или шринк лучше юзать обычный флекс-бэзис в медиазапросах, чем пытаться что-то вычислять))
Теперь flex-grow - не работает без явного указания flex-basis, так что лучшим решением будет использовать flex: 1, где видимо при отсутствующем явном указании basic последний будет считаться за 0.
Это лучший канал по вёрстке! Тупо как кофе пьешь и кайфуешь, самое топовое , что Вадим объясняет прям простыми словами , прям вот клянусь красава 💪🤝🔥! Спасибо Вадим за всё, всем советую твою канал! Здоровья тебе ✊
Благодарю
@@vadymprokopchuk
Gf
Простой как чашка кофе
Не по уведомлению, а по зову сердца, приятно снова вас видеть!
Благодарю)
Я чекав цю тему як манну небесну, дякую наперед навіть ще не подивився а вже вподобайка)) А вот за пояснення ,що ж таке Flex-basis окреме величезне дякую. Я думав що це просто замість width.
круто, дякую, радий що допоміг
Відео не тільки корисне, а й максимально позитивне.)) В цей непростий час, це як ковток свіжого повітря)) Дяки!)))
Дякую
Спасибо за материал, хорошая подача, легко и с юмором 👍. То чего многим блогерам не хватает.
Также рекомендация по flexbox играм:
жабки по началу весёлые без спору, но вот Flexbox Zombies - уровень поинтересней будет, больше практики и лучше "навык" отточит (там также есть игры по grid-ам и другие).
Спасибо, Вадим🙏 То что нужно было👍 Так рад каждый раз слышать тебя. Мира твоей семье и всем людям🙏
спасибо
1:15 - начало
3:32 - flex-grow
16:10 flex-shrink
24:30 flex-basis
Мне очень нравится твое преподавание: интересно, образно, с юмором. Flex былa очень сложной темой. Спасибо
flex-basis это такая бомба 💣💣💣💣 такого подробного учения я еще не слышал и не видел.
Salam Aleykum из Баку!
-Спасибо большое за ваши видеоуроки ! Всё понятно ,всё четко ... Приятно слушать ! Дай Бог крепкого здоровья вам и вашим близким !!!
дядька, поклон!
спасибо
Нравятся сравнения с маршруткой)Объяснение очень просто в понимании и не скучно смотреть) Спасибо!
спасибо
Новый видос пушка!!!! Вадим просто разрывает всем кабины своим топовейшим контентом!!!! Продолжай и дальше радовать нас, лучшими выпусками, т.к. это для тебя, как минимум будет отвлечением от всех бед, а как максимум - позитив и благодарочка от нас
спасибо
Кручее и злитым- это просто шедевр))) Вадим, спасибо за контент с юмором!!!
спасибо, я всё понял . учить верстке это прям твое . совсем не скучно и при этом информативно , респект .
Прислюнявим))) Прикольно ведете контент, Вадим! Но вообще хорошо объясняете, спасибо вам огромное!
Спасибо большое за видео.
Это третье видео которое смотрю на эту тему.
Подача супер, шутки тоже очень смешные.
Продолжайте это дело обязательно)
Всё очень даже не сложно, чтобы обобщать эти флексы, как делают это в интернете...
спасибо, я рад )
Привет Вадим, рад что ты вернулся!
Мужик, спасибо тебе большое за контент особенно в текущей ситуации и что продолжаешь делать на русском ! Желаю твоим друзьям, близким и знакомым самого лучшего ! П.С. и вообще всем людям всего самого хорошего!
Плюсую! спасибо, что не становишься жутким расистом, как некоторые другие стримеры, и не меняешь язык, на котором вещаешь!
@@MelkoR4111 #ищисвоих
@@MelkoR4111 типо белорусская расса
Вадим, а по js нет планов делать видео? Вы просто суперски объясняете
Вадим, безмерная благодарность за полезные, эффективные и позитивные уроки. Огромная просьба распихать их по возможности по плейлистам, так намного удобней искать на канале нужное
да, спасибо, нужно єто сделать
Очень соскучилась по вашим стримам. Спасибо за ваши видео)
кэф трения... улыбнуло =) Спасибо за твой труд!!! Берегите себя!!!
Потом Грибы, а потом Реакт и Редакс ))
Классные видосы, главное не останавливайся!
обязательно
это конечно классная тема, спасибо! но вот еще бы разобраться с position: ... они летят куда хотят. порядок если навести, было бы агонь в будущих видосах
Пересмотрел очень многих топовых и известных специалистов по вёрстке, и когда нашёл Вадима, то понял, что лучше канала я не найду!
спасибо
Большое спасибо за уроки, благодаря вам многие не тратят деньги на платные курсы )
Хорош, продолжай не смотря ни на что, очень круто!
Вадос, спасибо! Продолжаем работу!
Вадим, главное, что ты смеешься! Прекрасные шутки! Учу очередную тему и улыбаюсь очень громко.
спасибо
Вадим, спасибо за урок. Ждём видео про грид сетку.
Спасибо огромное за работу и уроки! мира и добра всем нам)
Вадим, это лайк) Классный ты мужик!
спасибо автору, за внятное к тому же интересное объяснения. баланс шуток и кода отличный, так намного приятнее и легче усваивать материал. удачи в росте канала)
Спасибо, это было чудесно и очень интересно! Игра с лягушатами -- милота =)) C удовольствием буду посещать данный канал, чтобы узнать что-то новенькое 😊
Спасибо. Ты не просто учишь ты вдохновляешь
Благодарю
Видос, ответивший на многие мои вопросы. На днях мучалась, делала таблицу на флексах, и вот теперь дошло, что flex-grow и flex-shrink совсем не по назначению использовала. А flex-basis, кстати, правильно, я молодец. Дайте сюда слюнявого эксперта, я ему объясню, что флекс-бейзис - ширина флекс элемента вдоль ГЛАВНОЙ оси 😉
дякую!
приятно было смотреть, хочется продолжать изучение, это невероятная подача, спасибо!
Благодарю
Лайк не глядя! Хотя, конечно же, посмотрю. Вадим, спасибо тебе огромное, что продолжаешь пилить видосы в это нелёгкое время! С твоего первого курса обучился вёрстке ещё летом 2019, потом уже без тебя JS (ждали от тебя, но недождались), сейчас работаю разработчиком на nuxtjs, но и там без вёрстки никуда!
Ты на мак перешёл?)
круто, молодцом, мак с 19 года, я с ним когда не могу за своим компом работать
29:52 ширина должна стать типа как бы высотой, если ты адекватный человек ))) улыбнуло, спасибо за полезный материал👍
как я примерно запомнил это все:
flex-grow считается как: Находим сумму всех коэффициентов (flex: 1, flex: 2 и т.д). Далее берем отдельный элемент, например с flex-grow: 2 и считаем, как разность между коэффициентом растяжения этого элемента и общей суммой всех коэффициентов. И умножаем это все на свободное пространство, так мы получаем размер этого элемента с учетом flex-grow.
С шринк такая же формула, но уже вместо свободной ширины используем оставшуюся после сужения ширину родительского контейнера. После подсчетов получим то, что нужно отнять от ширины родительского контейнера.
эти формулы в целом безполезны, но если много гровов и шринков с 2 3 2 1 3 и так далее, то может помочь
Отличные видосы про флексам! Единственное что не упомянул, так это gap во флексах, ведь ими можно задавать конкретные расстояния между элементами, но та пофиг)
Вадос, ты как всегда на высоте.
Привет Вадим, рад слышать тебя и то что ты продолжаешь тему по верстке! Хочу выразить свою благодарность по поводу своего обучению в вашем онлайн курсе Верстка 1.0. Спасибо огромное!!! Желаю ВАМ Мира, здоровья и счастья ! С уважением ваш ученик Олег из Молдовы!
Классно! Продолжай! Твой контент очень информативный. Спасибо!
Flexbox, flex-grow, flex-shrink, flex-basis ✊👍⚡
спасибо большое!. Я вроде и понимал и не понимал, но теперь все ясно как день)
Ты лучший) спасибо большое за видео!)
Вадим, ты очень добрый и светлый человек. От тебя исходит позитивная энергетика, не смотря на весь ужас, который происходит в твоей стране😢
P.S с флексами разобрался, очень упрощают жизнь, а вот с гридами не могу. Даже циклы в JS дались проще. Может, потому что я пытаюсь микросетку построить на гридах, а следовало использовать флекс? Если кто знает, напишите, пожалуйста!
Лучше не напоминать человеку о происходящем, оставьте это для других блоггеров. Он отличился своим целомудрием и адекватностью к происходящему. По крайней мере, он просто продолжил делать то, что он делал. За это ему большое человеческое спасибо!
Спасибо за крутой видос! Как всегда на высоте!))
Спасибо , Вадим большое!
ты просто супер, пасиба за видос, было угарно и познавательно
Топовый урок, обучился новым свойствам
Применять их конечно не буду 😅
))
Ти молодчина! Просто чудо!!!
Очень круто объяснил! Дальше только практиковаться!
Вот бы увидеть контент, как нужно из Фотошопа, да и вобще полный курс по декорациям svg на заднем фоне с паралоксом, адаптивом и т.д, анимациями.
Ура!!!!! наконец то ВЕЧЕРИНКА!!!!
улыбают твои шутки)
Спасибо за знания!стал учить верстку на этом канале сейчас учу js
Вадим, спасибо! Просто замечательные уроки. Было бы здорово, если была ссылка на донаты.
та как-то сделаю, забываю)
Спасибо, объяснил хорошо, а игра с жабками топ для тренировки.))
Вадос, чего решил мак прикупить?) Вроде на винде до этого был. Как оно, разница чувствуется?
мак с 19 года, видео на винде писал, мак в поездках юзал
Лучший, спасибо что ты с нами, твой ученик, который смог, но продолжает развиваться вместе с твоими видео! :)
топ юмор, топ контент) спасибо)
Спасибо за видео! Будут еще видео по флексам из этой серии?
та вроде уже все есть
@@vadymprokopchuk а, окей, спасибо за контент Вадос
Большое спасибо за урок !
Жду не дождусь марафона ;)
Лучший учител 🤓❤️
Вадим, подскажи пожалуйста, какой у тебя шрифт в VS Code. На маке он поприятнее, чем на винде.
comic shanns
Если я правильно понял, мы изначально задаём флекс-элементам нужные нам ширины через флекс-бэзис. В случае, если мы хотим растянуть их на всю ширину главной оси контейнера (или высоту, если главная ось - column), то мы пишем каждому элементу одинаковый гроу. Если же нужны разные пропорции растяжения элементов, то эти пропорции вычисляются от оставшегося пустого места контейнера. Т.е. это пропорции именно РАСТЯЖЕНИЯ, а не пропорции занимаемых ширин элементов в контейнере по итогу этой операции.
Я так понимаю, в случае верстки дизайнерского проекта вместо гроу или шринк лучше юзать обычный флекс-бэзис в медиазапросах, чем пытаться что-то вычислять))
все верно, а по поводу адаптива зависит от макета
иногда кажется что можно смотреть чисто ради твоей харизмы)
Та самая вечеринка которая оставила меня дома😜👍
О,спасибо)
"Я буковка, я знаю что мне нужно, так что отсекись😎"
Спасибо, супер понятно, красава 🤝
скажите пожалуйста будет или есть видео про расширение экранов для мобильных айпадов и компов ? благодарю!
когда ширинка не застегивается - на этом моменте выпал
👍👍👍🔥🔥🔥
Вадим, добрый день. Сделай пожалуйста обучающее видео по средствам разработчика. А шутишь и комментируешь прикольно.
спецом для тебя th-cam.com/video/58_AqypXjG4/w-d-xo.html
Запишы пожалуйста 1 раз верстку как ты работаешь, именно интересно посмотреть как работает спец, чтобы было понятно как это верстать быстро)
ты шутишь? или не умеешь гуглить или на канал его зайти трудно?
Дякую, тримаймось.
тримаймось
спасибо Вадос.
Большое спасибо...
Спасибо!
_flex-basis: 100%_ должно нормально смотреться
👍👍👍
мне бы такого наставника как Вадим ...
Теперь flex-grow - не работает без явного указания flex-basis, так что лучшим решением будет использовать flex: 1, где видимо при отсутствующем явном указании basic последний будет считаться за 0.
Нужно отдельный курс про 1000 долларовые сайты без контента.
Мне кажется или Вадим похож на Джонни Деппа?
Спасибо большое за 4к!
как сделать такой же шрифт в vs code?
Дякую. Було цікаво!
дякую
ля если вырезать все шутки из всех твоих видео, можно написать отдельную книгу "CSS Анекдоты"
👍👍👍👍 Спасибо!!!
клево! а что за мак такой большой?
мак про 16 дюймов 2019 год
@@vadymprokopchuk гдето заплакала старая рязанька 3200...
💪👍
а ориг статью забыл указать ? upd если,что то обьяснение из видоса это превод статьи которая вышла миллиард лет назад, даже примеры одинаковые
классно объясняешь, вот если б еще убрать эти шуточки-прибауточки за 300, то было б вообще огонь )))
я буковка))) мне как бы побоку))
суперрррр!!!!!!
Так что же, получается флекс грау бесполезен, потому что он не рабоиает с контентом?