Press "Enter" to skip to content

You can do that with one line of HTML?!



You guys are amazing! Here are the results of the #hamburger challenge.

homunculus1984 – https://codepen.io/Homunculus84/pen/gOOqmvY
Tim Rinkel – https://codepen.io/t_rinkel/pen/XWWoKWX
Riza Khan – https://codepen.io/riza-khan/pen/mddaVbY
Vipin Mishra – https://codepen.io/vipinmishra/pen/RwwqyVN
Vlassis – https://codepen.io/vskand/pen/ExxGaBJ
Jason Levine
– https://codepen.io/jasonclevine/pen/rNNqPMB
– https://codepen.io/jasonclevine/pen/PooyVeB
Martin Langenberg
– https://codepen.io/JustMeGraham/pen/jOOeXJp
– https://codepen.io/JustMeGraham/pen/yLLQzEd
– https://codepen.io/JustMeGraham/pen/gOOQRyY
Jannis Göing – https://codepen.io/Jannis3005/pen/VwwEgb
Bobby Bosler – https://codepen.io/bobbybosler/pen/LYYgqwO?editors=0100
Remko Spaans – https://codepen.io/Remkoe/pen/KKKGYdX
Katie Harshman
– https://codepen.io/pie9/pen/ZEEqmdv
– https://codepen.io/pie9/pen/NWWOmMw
– https://codepen.io/pie9/pen/GRRPNgN?editors=0110
David Betz – https://codepen.io/RDBetz/pen/xxxyyzg
Koosemose – https://codepen.io/koosemose/pen/gOOBVBm
Soumya Dey – https://codepen.io/soumyadey200/pen/pooQeQK
Kalle Elmdahl – https://codepen.io/Coldey/pen/gOOQPgr
Саша Плешаков – https://codepen.io/SashaPl/pen/vYYQGzp?editors=0100
Steve Hall – https://codepen.io/steebn/pen/abbQqMm
Steve Raymond – https://codepen.io/sraymond44/pen/QWWJBpW
Chakib – https://codepen.io/chakeeb/pen/BaaGXmL
Mohammed – https://codepen.io/frerosami7/pen/wvvRooP?editors=0010
Łukasz – https://codepen.io/lukesw/pen/MWWLjRQ
Simone – https://codepen.io/Homunculus84/pen/gOOqmvY
James Smith – https://codepen.io/james-r-smith/pen/JjjxVZB

Kyle Shook @elyktrix (bonus)
– https://codepen.io/kyleshook/pen/eYYxYRp
– https://codepen.io/kyleshook/pen/XWWoPXz
Amit Sh – https://codepen.io/amitsheen/pen/VwZNWWR

The Community – https://discord.gg/nTYCvrK
Come and join us over in the community by clicking the above link! It’s a Discord server where you can hang out with and talk to other people who’re interested in learning front-end stuff, including me 🙂

I’m on some other places on the internet too!

If you’d like a behind the scenes and previews of what’s coming up on my YouTube channel, make sure to follow me on Instagram and Twitter.

Instagram: https://www.instagram.com/kevinpowell.co/
Twitter: https://twitter.com/KevinJPowell
Codepen: https://codepen.io/kevinpowell/
Github: https://github.com/kevin-powellom/KevinJPowell

0 0 vote
Article Rating
Subscribe
Notify of
guest
29 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
M E L A N C H O L Y
M E L A N C H O L Y
7 months ago

can you do a scroll snap tutorial plz , I think its the time for it and it's very useful

33KK
33KK
7 months ago

Technically it's still one line of you minify HTML

Nevci Academy
Nevci Academy
7 months ago

I love that game

Luke Barren
Luke Barren
7 months ago

Hey Kevin, 10/10 vids:).. Just subbed. I have been learning html/css for two weeks & am at the point of creating my very first carousel. I would like a fade in & out slider changing every 5 seconds with next/prev chevron buttons & slider selection buttons. The nearest i have got is using js & cycle2. There seems to be many different ways to achieve creating a carousel but it's blowing my mind at the moment. bootsrap for some reason seems like cheating, then there is js/jquery & pure css & other methods. I would LOVE & APPRECIATE a small… Read more »

Mohammad Sadeq Asghari
Mohammad Sadeq Asghari
7 months ago

I have just one word for you Kevin : amazing! thank you

Саша Плешаков
Саша Плешаков
7 months ago

Nice challenge 👍
I was waiting how Kevin will spell my name written in cyrillic)

Jahir Khan
Jahir Khan
7 months ago

31 codepen.io tabs you opened!!!

Koosemose
Koosemose
7 months ago

Hahah I was waiting for the "Koosemoose" it's the most common mispronunciation of my username. ( "mose" is pronounced with a long O, like "mole" but with an S For as much as I prefer simple visuals, the actual hamburger ones were amazing, and they certainly would stand out on a site where they were appropriate. And I've also got to say thank you, Kevin, as of a month or two ago when I started watching your videos, the last I had updated my css knowledge, using "clear" was the new hotness for making columns, and now I've already done… Read more »

CINTRON
CINTRON
7 months ago

Dang, Katie Harshman killed it with that cheeseburger and fries one. That has to be my favorite entry. Sure McDonald's is like the only place that could actually use it but still, well done. 👏

CINTRON
CINTRON
7 months ago

For those of us who do remember flash we're all like, "Thank God it's gone".

MD Riaz
MD Riaz
7 months ago

It is a lot of work to save all of them by going from the link,,, somebody please make a Codepen collection from all the pens in the video description

Jens Törnell
Jens Törnell
7 months ago

I have another approach in my Tiny Drawer library – https://github.com/jenstornell/tinyDrawer.js I simply put the X on the backdrop so the X is not really a button, but still help the user. What I could do in the future is to animate something cool with the X as well.

A Z
A Z
7 months ago

One line = 45 min video ))

Vipin Mishra
Vipin Mishra
7 months ago

Yeah.. was waiting for these creations. Awesome stuff!!

Thanks for featuring mine as well.. Would love to do these fun stuff in future!

James Smith
James Smith
7 months ago

Ahh, mine was not hamburger to flat hamburger. Rather, hamburger to hotdog. 😅 This was fun! Thanks for setting this up, Kevin! ☺️👍 Your content is always so great to watch. 👏👏

Katie Harshman
Katie Harshman
7 months ago

It's so fun seeing all the ideas everyone came up with! Great job, everyone! I would love to see more challenge videos like this. It inspired me to try things I wouldn't have thought of otherwise, learn new techniques, and practice skills I'm learning. Keep up the awesome videos Kevin!

DiNOo Gaming
DiNOo Gaming
7 months ago

this is cool but the thing is we don't see like these in real website why is that ?

ChroniZz
ChroniZz
7 months ago

Awesome! Great work guys!

Truth Humanity
Truth Humanity
7 months ago

"You can do that with one line of HTML?" – where?

Paul Silver
Paul Silver
7 months ago

I know it’s late in the day , but I’ve just seen this video. Can you please let me know what you think of the hamburger/nav at https://Paul.gd

frerosami7
frerosami7
7 months ago

Awesome Thank you very much

Shivank Sharma
Shivank Sharma
7 months ago

Thank you Kevin

TheWebStylist
TheWebStylist
7 months ago

SO many awesome menu styles! I’ll see if I can get a few to work on some demos of mine (I’m not very good w coding though very much a visual and web designer) 🙌🏻⚡️💪🏻💥👏🏻

The Cake Glutton
The Cake Glutton
7 months ago

Was trying to watch this on my TV and had to give up, not sure what’s the video aspect ratio but there’s no way to make it fit, there’s always cropping at the edges.

Crous Dioll
Crous Dioll
7 months ago

this is awesome, thank you Kevin

toluschr
toluschr
7 months ago

Don't look at how many tabs he has open.

Abdelkadre El Maghri
Abdelkadre El Maghri
7 months ago

First like

Paradigmshift22
Paradigmshift22
7 months ago

Your clickbait game gettin strong 💪

Chad Tower
Chad Tower
7 months ago

first

29
0
Would love your thoughts, please comment.x
()
x