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

A A Yusuf - Abqariyuh

10/10/2024

Tree View For Sidebar Nav Drop Down

Hi, I was working a project and had to create a filter, kind of sidebar navbar. Please see the attached image and help me achieve that....

Sleep Twitch

10/10/2024

Change order of elements to horizontal instead of vertical with CSS Columns

Hi, I used the example of Coding2Go (nr 2 in this video) to create a masonry layout using CSS Columns. But Columns distributes the items first in column 1, then column 2, then column 3. What I would like is that the elements are distributed from left to right and then top to bottom. https://www.youtube.com/watch?v=44FTAS-qT8Q...

Καλημερας

10/10/2024

Backdrop-filter doesn`t work

I am trying to build a login/register UI and i want to use the backdrop-filter to blur some background ( just expirementing). Here is the code in code pen https://codepen.io/nikas19/pen/wvVojor. The backdrop-filter doesn`t work....

Faker

10/10/2024

Trying to make a login form

Hello guys, sorry to disturb you all, can someone explain why the border of my input element isn't disappearing please... also, can someone explain how I should proceed to add some space between the input and img element please... I try to use row-gap but nothing seems to happen, why please Here is my codepen: https://codepen.io/Fakeur/pen/ExqNQvZ...

empty

10/10/2024

select input with empty value using css

HI guys, I want to select an input element which is empty by using css. I tried :valid and required attribute. But the field is optional, I wonder is there other ways to select the input with empty value? ```html div:has(input:empty) p{ // do something }...

Faker

10/10/2024

Creating a 3D effect sign up/login form

Hello guys, sorry to disturb you all; can someone explain how I can do to create a "3D rotating" sign up/login form please, like when I click on sign up, the form is kind of rotated then sign up information appears... here is my codepen for the login form... https://codepen.io/Fakeur/pen/KKONXEz...

Bloodfire

10/10/2024

Make absolute positioned element expand to the right (css)

I have a problem positioning an element. HTML and CSS is abstracted as follows: //HTML ...

Adison

10/10/2024

Problem with using :nth-of-type(1)

I've two divs with same class name as "empty", since there are two divs with same class, I was hoping to control one specifically, the first one to be exact so I used

.empty:nth-of-type(1)

.empty:nth-of-type(1)

but the style I added like display block, height 30px like these didn't work at all, on browser on console it was as if the css styles weren't there at all, it works if I just select .empty{} and now do the styling ofcourse, I'm providing the codepen link https://codepen.io/Pravinik/pen/QWeGggd In this clone spotify login page which I’m working on right now. Check line no. 50, 51 on html file, there will be two divs with class name as “empty” and in the css check line number 392 where I’m targetting the html element (empty) but seems not working Thanks....

SneaX

10/9/2024

Why does text input not shrink

I have this code, why does the text input not shrink according to its parent, it causes an overflow ``` <div className="text-2xl font-bold capitalize md:block hidden">{currentSection}</div> <div className="md:hidden"><Image src={Logo} alt="Logo" /></div> <div className="md:flex min-w-0 justify-center hidden">...

vince

10/9/2024

Does it make sense to use the title attribute for this?

I want to create a tooltip for users so they can better understand what an icon means (see image). Does it make sense to use the title attribute for this or is it lazy? Here's my code: ```html <div class="icon" title="For sale">...

lko

10/9/2024

Why do grid gaps get bigger during transition

As you can see here: https://codepen.io/Lko3001/pen/gOVLwVz, when you hover over the card, there's a weird space between the title and the description, it's caused from the grid-template-row but I dont understand why and how to fix it

Faker

10/9/2024

Styling a sign in form

Hello guys, sorry to disturb you all; can someone explain how I should proceed to make the icons appear in the text area of my inputs please, like the little icons are part of the "rectangles"

דניאל אסרף

10/9/2024

Animating an element towards another element

I tried it using framer-motion library but didn't found a way for it to work on all screen sizes. I want to create a big warning modal that would show on the center of the screen for a couple of seconds and then shrink and move to a specific div as child of a flex container I have there.

Faker

10/9/2024

What is vite

Hello guys, sorry to disturb you all... I just came across the term "vite" on the internet.... I noticed that is it mainly used for web development but I don't understand what it is, for what is it used for and why is it helpful... can someone clarified it please

thatsmokshanirugutti

10/9/2024

Need help with re-creating a animation

I have tried to re-create a animation from a website but it didn't work out well. Any help will be great visit this repo for more details https://github.com/mokshanirugutti/mixed-scroll...

Trevor

10/8/2024

Is it possible to have two interactable HTML dialogs open at the same time?

I've got a situation where in our current environment our modals are hand built with divs and positioning. I've been in the process of migrating them to a native HTML dialog element and have a situation where an initial modal would be open, and a second modal can be opened in a side by side view to do additional work. I'm not sure how or if two dialogs can be open and interactable at the same time. I think I can technically achieve this by opening them with .show() instead of .showModal() however I then have other problems with dom layout and z-indexing if done that way. I also lose the niceties of the native dialog. Any ideas?...

snxxwyy

10/8/2024

when is it not acceptable to change an elements display?

Hey, when is it not acceptable/valid to change an elements display property? For example, changing an inline to block. Thanks in advance.

R.I.P

10/8/2024

4questions

hi i recently thought of making a canvas without having access to html so just css and no js of course 1-lets say the whole page doesnt have canvas and div and button and p so can i use ::after/before and change it to canvas or any other ways that make another element live div canvas 2-just create canvas from nothing 3-another question is about making the actual site by css html and js I realised recently that i need to learn php and i thing other stuff too i was wondering is it possible that i do js and html and css but the rest would be on someone elses hand and if i look for a partnership like this what would i call myself ?am i frontend? and need a backend?...

Knight

10/8/2024

Help regarding footer and background animation

Here's the link to webpage -> https://alfaarghyadev.vercel.app/ Does anyone here know how to make the footer section as well as the background animation part, i would be glad if u can share resources where i can learn more about them...

Abdul Ahad⚡

10/8/2024

How would you approach this button?

I've tried using as background image but it's not reponsive for full width buttons.

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 🙂.