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

torres

6/19/2024

Getting 'position: absolute' to be responsive😕

Yes, I am about to look at Kevin's video next(again). My problem is understanding position and images. But both together I am always stumped. Problem: the <svg> just happens to be an image. It looks fine now. Still not sure why. However, on smaller screens it keeps moving. Should I use media queries. Isn't there a better way? https://icodethis.com/modes/design-to-code/526/submissions/304931 Thank for the help.

bigdaddy

6/19/2024

React grid generation

In react if I have a grid and I want to update a single cell when clicked on is it fine to re create the whole grid every time a cell is changed or only to update the state for that specific cell. The reason I'm asking this is because if I'm updating the whole grid the code will be less complex but if I'm updating only a single cell then the code would be more complex but will be more efficient

reeee

6/19/2024

how to select two nth children in css

i have a container that contains 6 children, i want to select the 3rd and 4th children .

EmSixTeen

6/19/2024

Help with consistent alignment across cards 📏

Hey there! I have a little bit of an issue and am wondering if anyone has a smart solution for it. I have these pricing cards, and inside the cards there's a little box. The issue is that I'd like to keep them visually aligned across the cards, even when the text above them is of differing length - Is that possible? 🙏 It should be more obvious what I mean in the picture I've attached....

WithMyTes…

6/19/2024

How to add Gap to Grid Elements that are "Display: Contents:

I'm trying to have the team sections separated by a few px but im struggling with the current structure of my setup. Do I need to change my HTML to achieve what i'm looking for? I was using the display:contents on the team section so that i could put a team background image in each section. https://codepen.io/tvu1313/pen/NWVyXGE...

empty

6/19/2024

infinite scroll

Hi guys, I'm facing a problem with react-infinite-scroll-component. When I scroll to the bottom the fetchNext func is not called. Can anyone help me? ```ts const WishList = () => { const [productList, setProductList] = useState<WishListProductResponse>(); const [pagination, setPagination] = useState({...

Guie

6/18/2024

Figma / SVG Mask Path Change

My designer gave me this from Figma, and I'm really perplexed. The image of the person is contained within an SVG mask. The path of the mask changes on hover and also includes a transition. Every attempt I've made to do this ignores the transition. Any tips?

Luke

6/18/2024

animations - hamburger menu

Hey, So I’m pretty new to this stuff. I watched the video on hamburger menu animations. Is there an easy way to design these animations? I don’t even know where to start. I haven’t done any animations before. Are there any resources I should be looking at? Software that could help me visualize the animation and then get the path data to put in my code? Any help is much appreciated....

Uhur

6/18/2024

Replicating Kevin's Pen With A Different Layout

I am trying to visually replicate https://codepen.io/kevinpowell/pen/GrLKNo by doing https://codepen.io/imdiau/pen/OJYQpNw ...

sos

6/18/2024

Centering with margin

Why does margin: auto only center horizontally? how is the browser not able to calculate the vertical margins the same way it would for horizontal margins, even when the element being centered and its parent have known heights

EthanOB

6/18/2024

CSS Container Queries not working

I was going over the bare basics of container queries in CSS and I was not able to get the colour paragraph inside the container to change when the div's size is >=400px <style> .container { container-type: inline-size;...

smackalpha

6/18/2024

How to Integrate webengage in nextjs app

I used WebEngage for tracking users. In React, I pasted the code in index.html under the head tag and it worked fine. In Next.js, since there's no index.html, I pasted it in _app.js, but I'm getting an error. ``` v4.js:1 Uncaught SyntaxError: Unexpected string (at v4.js:1:90) storage-frame-1.13.htm:1 Uncaught ReferenceError: webengage_fs_configurationMap is not defined at t.onload (storage-frame-1.13.htm:1:2858)...

tanka

6/18/2024

how do you go about creating the main background image to take full screen

I mean I know about vh and vw so that the div takes up fullscreen, but a side-effect of that is when you have header, the image starts to extent the vh and starts going below the bottom of the screen theres one way that I found on chat gpt, which I guess would work, ...

vince

6/17/2024

How to match border height of element

I have 2 links inside a container in the picture. The markup looks something like this: ```html...

Jeremy Parker

6/17/2024

Are CSS Variables Bad?

I'm a solo developer, so there's lots of "industry standard" / "common sense" stuff that I don't know, and, sometimes my work will have me prop up some PHP COTS software, and it seems like every time I dig into the code of other people's projects, I never see CSS variables; I feel like the only time I see them is in "cutting edge" companies or huge sites with their own css frameworks. For example, right now I'm tweaking an Omeka installation, and they have a few settings the user can use to set background color, brand color, etc -- and then in the PHP, they assign these values directly. In the equivalent of "index.php" they have this: ``` <?php if ($buttonColor = $this->themeSetting('button_color')): ?>...

Ubong Josh

6/17/2024

setInterval loops over the first character

What was I trying to do? Trying to display the page brand name one letter at a time, on page render.. What have you tried already to fix it?...

Sam Wolfgang

6/17/2024

Control CSV CSS z-index.

Hey team! I'm new here and to coding so ignore any mistakes (just looking for help about this specifically), I'm aiming to solve a problem where I'm importing a CSV and need to control the z-index. I'm finding it super difficult to even see any changes! Anyone able to help? P.S. removed the rotation axis intentionally, I forgot to put a letter back in before sharing....

message.txt

MarkBoots

6/16/2024

[brain-breaker] mask-shorthand. Firefox does not like it

Long time ago I dropped a question in here. I'm making a list where the markers are a puzzle piece (using masks). In chromium it works like expected, but: [brain-breaker]...

Vipe

6/16/2024

Struggling to display titles from api (RapidAPI)

I'm trying to learn Vue.js and I've started making a clone of MyAnimeList to practice. I'm attempting to display titles from api in h2. Can someone help me, please 🙏 ? Here's API screenshot (lightshot): https://prnt.sc/TWcfNnWIW2IR Here's the API link: https://rapidapi.com/felixeschmittfes/api/myanimelist...

Ben

6/15/2024

Angular and nest.js help

Hello. I've been developing for eight months. Right now I'm working on a project that uses Angular for the frontend, and nest.js. for the backend. As far as API requests go, I've got a get request, and a post request... here's the relevant code: ``` //hymns.service.ts import { Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http';...

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