Kevin Powell - Community

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

Need some help with my form

Hi guys anyone got an idea why my form is not getting the result it has in the picture, text area is not getting how it should be My code: https://codepen.io/Boeroe/pen/oNmzBBg...
No description

useContext react

import React from 'react' import ReactDOM from 'react-dom' import { useContext } from 'react' const konteks = React.createContext(null);...

CSS challenge - grid/flex fill space

Hey everyone! 👋 I've stumbled upon an interesting CSS challenge. I've attached an image showing the desired look. If any CSS wizards have some time and would like to give it a shot, I'd greatly appreciate any insights or advice. Thanks in advance! 🙏...
No description

HTML Canvas flickering

Hi i am trying to build a editing application like canva. right now i added functionality of image adding, resizing and dragging: https://www.veed.io/view/7867c461-0e4a-47b8-b0d0-b498ccc8d67f?panel=share. When i make any of dragging or resizing or even selecting an element on the canvas. the canvas flickers. I think this is because of frequent draw on canvas. How to avoid it.?

Freelance web developer day rates in USA?

what are usual day rates for wordpress web devs?

Typescript type for array passed as string

I'm trying to convert a comma-separated string(knowing the possible variations) to an array using each element of the array as key of a dictionary of icons. Does anybody knows how to do this? const Iconos = {...

Input label over text issue

So I find myself achieving the effect I want, as you can see with the password input, but when you write something in the email input that's not valid the label goes down to its original position, hiding the text. I've tried using :invalid pseudo element but it makes the label stay up if there's no text....
No description

col-12 ,col-sm-6 and col-md -4 grid issue in bootstrap

i have defined the classes in my div but when i add col-md-4 all of the columns are start taking equal width as col-md-4 even sm screen sizes are also taking same width as col-md-4 here is my code"`<!DOCTYPE html> <html> <head> <title>Bootstrap Responsive Grid Example</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">...

Dude, Where is my nav?

Doing a iCodeThis project and for some odd reason I went with a desktop first design. Now when do the media queries, I thought they are coded correctly but for some reason my hamburger menu does not appear on small screens. This has been a real pain to figure out why it is not working, so I though I would ask in here. TIA https://github.com/andrewteece/growth-landing-page...

Modify the colour of a specific letter

Is there any way I can change the colour of just the dot with css?
No description

Javascript hashmap

```js function zappa(nums) { const mapObj = new Map(); for (let i = 0; i < nums.length; i++) { mapObj.set(nums[i], i);...

I want when you click the button text to appear

I want when you click the button text to appear so I can make the divs the same height and size before the button is clicked https://codepen.io/Boeroe/pen/OJdXwBv...

Need help with CSS Flex

https://codepen.io/Yasssh-Patel/pen/xxMOWYw?editors=0100 here is the code but the problem is TopLeft div is working perfectly but all the other divs are not working...

Can't get rid of space on right!

Is anyone good at css ? I have been stuck at this problem for a long time now . And I don't know how to resolve it . I am trying to get rid of extra space on the right side in the image below but I have bi luck with it, can someone help me?
No description

How to achieve smooth scrolling in react

Hi Folks, I came across this site website "https://olaolu.dev/" and i'm trying to recreate this using React and SASS. Now i have no idea how he managed to achieve the scroll for each pages. i don't know how it smoothly scrolls to next page. Can somebody help me on this...

can someone explain it to me how this is made

```jsx <div className={Css.Specifications}> <h3>Specifications</h3> <div className={Css.cards}> <div className={Css.card}>...
No description

Grid-area, why is my header not spanning across both areas?

https://github.com/callum-laing/react-first-app I think I've written the code where it needs to be, however could someone please take a look and see if you can find out where I'm missing? the header is inside Heading.jsx, which has imported inside a <header> tag in app.jsx....

CSS Reset - Does anyone have a solid one?

Tried googling some, they all vary very differently, since this discord is full of chads and chadettes, I'm hoping one of you can provide a good one 😄