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

msilva8222

7/26/2023

Hi everyone!

with and ,and I'm a beginner (for real) in the front-end world. I'm doing an online course which at the end of each session there's a little project. In sum, I can't understand the last project we were supposed to do. I saw the solution video, the solution code and I just can't understand what's happening there. I googled, search for videos on Yt, but honestly I can't understand 😦 If someone can please help me understand what's going on with that solution, I would be absolutely grateful. ...

Rosen

7/26/2023

Build a space travel website > background-size: cover and background-position

Hi everyone, I just completed the above-mentioned Scrimba course. My questions are related to this video: https://scrimba.com/learn/spacetravel/adding-the-background-images-cof4b40e185ce1ca26fd638c0, where Kevin adds background images to the homepage. I couldn't understand how exactly background-size: cover works together with background-position . My questions:...

Allen

7/26/2023

Text box Highlighting

Hi, on my react app I have added a textbox where users can enter input. However whenever you click into it, there is a dark gray highlighting that appears and then goes away. If you hold click, the dark gray just stays. I have done outline: none but that just removed a blue highlighting that persists when you are using the textbox, here is a video of it and the code I used for it. Thanks!

Reine Beth

7/26/2023

Focus problem with VoiceOver

Hello ! I’m working on a modal and I have a problem with VoiceOver. When I try to open a second modal with iOS VoiceOver on mobile the focus stay on the trigger. ...

magenon

7/26/2023

Scroll Effect

I want to make this scroll effect. I searched a lot in YouTube and Google , but i didn't find the effect that i want . I don't know if i can do it only with CSS or i need to use JS...

Aditya Kirad

7/26/2023

em and rem units with media queries

Hey folks in one of kevin video i saw him using em and rem units with media queries for setting max-width, min-width etc. in them why is that don't we require px unit to set the breakpoints

Nikita

7/26/2023

how fix this framer-motion bug?

```tsx <main className="absolute inset-0 -z-10 min-h-screen text-center laptop:text-start"> <AnimatePresence> {mainText.isOpen && <motion.div className="absolute top-1/2 w-full"...

Hamza Naeem

7/26/2023

Reponsive Radio Button

Please check this code, I want the small dot inside radio button to be centered , I knew I can do this using position but when screen size changes the small circle changes it position which is not good for responsiveness, plz suggest the best practice to make this radio button responsive and in center in every screen, thanks https://codepen.io/hamzacodepen951/pen/wvQYvab...

SurprisedPika

7/25/2023

Button Won't Focus On Click (Except In Firefox) Despite Having TabIndex of 0

I created an event that fired on Keyboard Events on a button. In Firefox, I could click on this button to focus it, then press any keys on my keyboard, and the event would fire. In Safari, I could not click on the button to focus it, and had to navigate via keyboard to it. Only then would the event fire on key press. I researched this, and found: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex "Note: If an HTML element renders and has tabindex attribute with any valid integer value, the element can be focused with JavaScript (by calling the focus() method) or visually by clicking with the mouse. The particular tabindex value controls whether the element is tabbable (i.e. reachable via sequential keyboard navigation, usually with the Tab key)." ...

Brightie

7/25/2023

Confused with gap in flexbox objects

Gap between the red box and the bordered text needs to go, cannot figure out what causes this gap to be there.

thebigpal

7/25/2023

How to create a header, main & footer?

I've been trying to create a header, footer & main. I kinda came up with a okay result, but it's a little bit buggy and I think it's because I don't know how to make it the correct way. Can someone please guide me step by step how to do it the correct way? Including zooming in and out and all that. I have $1 on PayPal, I'll pay. I just want to figure this out....

omo

7/25/2023

unable to fill/color svg

Sorry to ask a super basic question, but i've been trying to change the color of this svg for a while, and it's not complying. The fill does work if i change it in the embedded svg directly, but it doesn't want to work in css for some reason. I tried using !important and other stuff i saw on stackoverflow, but i'm now at my wits end. Please help me https://codepen.io/Azure-Lance/pen/eYQLjKG...

M@HeR

7/25/2023

how to center last row item in grid display

how to center last row item in grid display. the center of last row when number of items less than number of grid template columns what is the similar of flex:flex wrap...

Takeo

7/25/2023

advise on a new website

i would like some guidance and advise as this is my first website build. this is my deployment so far https://dkingdev.github.io/MP1/ the code is free you, so i dot mind sharing it as its for educational use anyway. but i can only use html and css

Aditya Kirad

7/25/2023

click event listener automatically triggering

hey folks can anyone check this pen out the click event listener attached to slider in this code is automatically triggering which is supposed to only trigger when I click the slider. https://codepen.io/adityakirad/pen/oNQPEGW...

redtypoOooOo

7/25/2023

are these breakpoint good practice for this website?

I am trying to make this website n wonder if the breakpoints below are ideal for this web design? https://olhanorenko.contra.com/ are there any methods to decide breakpoints n setting up container for each sections? ```$XXS: 390px; $XS: 576px; $S: 768px; $M: 992px;...

Kyle B.

7/25/2023

static site generator

is it possible to merge the non-ssc site I made to ssg(static site generator)? I tried to do it but I can't link css and js.. also I use Jekyll.. do you have any ideas guys? im open for suggestions

I goon to clippy

7/24/2023

How is it made?

Can someone explain how the opening grid animation is made? i want to learn but even looking at dev tools its just so hard to interpret, i have no idea where to begin or where to look. https://imjulien.dev/...

lko

7/24/2023

How to create this layout

I want to recreate the layout shown in the picture, the height is 100vh and I want an element to be centered in it, and then, below it a scrollable element (only that element must be scrollable, not the entire page) I tried this but didnt work: ```jsx <main className="min-h-screen h-0">...

M@HeR

7/24/2023

card same height with grid display

I want to make card with same height with different content The problem is of Grid template row:repeat(3,minmax(200px,450px)) When i have card without discription the height will be less than other...

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