KPC

Kevin Powell - Community

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.

Join

KPC

Kevin Powell - Community

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.

Join

front-end

resources

back-end

ui-ux

os-and-tools

help

Faker

8/6/2025

Why do we have so many free hosting websites

Hello, there are many free hosting websites, like vercel, github pages etc. Why there are so many hosting websites? How are each one different from each other?...

AFastCuber

8/6/2025

Make button width be determined by text after text wraps

My button looks great until the screen width gets too small and then the button text starts wrapping. That’s fine but the problem is that the width of the button stays the same and so it looks like there is a ton of padding even though there is not and the element overflows because of that. A width of fit content works until that text wraps. How do I make fit content work even after the text wraps?

Faker

8/6/2025

Progressive web app and technologies needed to build one

Hello, can someone elaborate on what a progressive web app is please. From my understanding it's just a responsive web app that works both on pcs and mobile. Are there any recommended technologies that we can use to build one?...

ᴋʙ

8/5/2025

Emulating a range slider

I am creating a highly customizable range slider with possibility multiple of multiple "thumbs" What i am trying to understand how to make it as accessable as possible. I am guessing that the input type range is as accessable as it can get, so how cam i emulate that....

ZNP

8/5/2025

What Methodology of CSS does Kev follow?

Kevin uses a mix of CUBE CSS and BEM, what exactly does he do? are there any specific guidelines he's said or you guys have noticed? I remember there was a video of him breifly explaining it, i've got his gold course, but i don't know which video he says it in...

Faker

8/5/2025

Difference between width set to 100% vs 100vw vs auto

Hello, can someone explain what is the difference to width property in css when we use 100%, 100vw and auto as values? 100vw is always relative to viewport width? 100% is always relative to parent container? ...

Faker

8/5/2025

What is Redux and why is it important in JS?

Hello, I often see people use the term "Redux" often in JS, can someone explain what it is and why is it important please.

Faker

8/5/2025

How does "dynamic" searching work?

Hello, consider a social media platform where we have a search bar. Normally, let say we are looking for a person John Doe. When we first type John, without even having to press enter, there are a list of suggestions that appear. I was wondering how does that work? I might have some ideas: The ineffective one:...

Ray

8/5/2025

Having some trouble designing a form generator.

I'm probably using the wrong words to describe things and I'm sorry for that; I'm self-taught and haven't been doing this for very long. This is a vanilla PHP question; I'm not using a framework or any libraries. So to start, what I have works fine. If I feed my FormPresets class a list of functions to do, it gives me the corresponding preset form fields paired with the appropriate labels, menus, headings, and section information that I expect for the context....

Stjerneman

8/4/2025

How to Keep Subgrid Row Sizes When Gap Differs from Parent?

I'm experimenting with CSS subgrid and ran into a problem with mismatched gap values. Kevin has this wonderful video on subgrid (https://www.youtube.com/watch?v=Zddz_R1RnfM&t=832s&ab_channel=KevinPowell), where he shows product cards using grid-template-rows: subgrid. In his demo, the gap on the subgrid matches the gap of the parent grid, and everything lines up nicely. But when I change the subgrid's gap, or the parent gap, the row sizing no longer behaves as expected....

davidhurwich

8/4/2025

<picture> / srcset

Hi, just interested for those who take care of responsiveness as part of your workflow if your team uses <picture> or srcset for image distribution between devices. I've noticed that most websites these days are 50/50 on whether these use <picture>. If your team does do you handle it, or does your CMS handle it?...

Pete (he/him)

8/4/2025

Difference between `:open` and `[open]`

I've just realized that :open is not supported on Safari. From what I can tell the [open] attribute selector should be a drop-in replacement (at least for my use case, styling a <dialog>). Can't find anything backing that up aside from Google's AI summary when I search for it. Does that seem right?

soma-foreever

8/4/2025

transform: translate vs translate, what's the difference?

It's not very clear from the docs how they're actually different. They both tend to do the same thing afterall. In the following example, the output will be same. ```css .container{ translate: -50px; /* transform: translate(-50px) */...

Altair

8/4/2025

Understanding Grid system

Code Pen: https://codepen.io/mab141211/pen/NPGjqbv I want to use the 0fr to 1fr grid logic in order to make this side bar work in two ways one normally when it will always be displaying and the other when it will be displayed only on hover and the body should be touching the ```html <div class="aside"></div>...

Collins

8/3/2025

challenge 02 conquering-responsive- layout Error

please, can someone proofread this code and check if this is also a responsive way of writing CSS and possibly provide a solution. i feel like I may have done something quite different from the norm. The code is below: https://codepen.io/Collins-Cypher/pen/jEbBRpB...

StainingLamb272

8/3/2025

Kevin's code not working on my PC

Hi, I've exported the files from codepen (https://codepen.io/kevinpowell/pen/xbGeNQy/ef22ccea0c2d257ae1a748f5fd4646da?editors=0010) and extracted the zip on my computer. The problem is the theme won't change. The page displays with the 'light' style from CSS (my system is dark) but nothing happens when I change from the dropdown....

thethingisback

8/3/2025

Dynamic (useRef extracted) styles not ready (assigned to useState var) in time for element mount

GH: https://github.com/nndesigns/old_cars_ltd.git Vercel: https://old-cars-ltd-4p2r-git-main-nick-nalls-projects.vercel.app/ File: vehiclePage.js (/frontend/src/pages/vehiclePage.js) ...

Faker

8/3/2025

When do we need to lift state in React?

Hello, can someone explain when and why do we need to lift state in React please. Like what should come to our mind for it to be spontaneous, "to achieve this", we must lift state "because lifting state allows us to...", I need the fill in my mental model gap :c

Kingpin

8/3/2025

Free smtp

anyone who can recommend a free smtp server?

steveo42

8/2/2025

where do I start conversion of an old static html site over 1500 pages? a bit overwhelmed

I set up a codepen https://codepen.io/steveo212/pen/qEORdLr to illustrate the basic structure. Looking for help on where to start. The site needs to be responsive, so the main menu needs to collapse to a hamburger (minimal to no JS if possible). FYI, this is a passion project and the site does not generate revenue, I'm just trying to modernize it and practice some of what I am seeing on Kevin's youtube videos so that I keep the consistency on the approach.
Question: Is the HTML structure appropriate or should I consider a different approach? The channel-menu-bar-section is a bit redundant. What I'm trying to accomplish is that when the site is being viewed on a mobile device, the user can still understand which channel they are in and select a different article within the channel. When viewing on a desktop, have two columns where the channelName is displayed and articles are listed. Please direct me to which videos I should watch as I do want to learn. Thank you...

Previous Next

Gaming

Programming

Kevin Powell - Community

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.

Kevin Powell - Community

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.