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

griff

5/16/2024

what are your opinions on custom cursors?

would you say it's bad overall / depends on use case / can be tasteful / accessible? been styling custom cursors and enjoying it but wondering if my time might be better spent on something else -- also really curious for those with clients if they enjoy the custom cursors or overall how they're received by non technical people / business owners...

KirK

5/16/2024

Has anyone an idea what is happening here?

I use Edge and when I scroll the images disappear. After interacting they will be shown again. It seems random what images are go missing and I tried it on desktop and mobile. Here is my current working state: https://codepen.io/kirkone/pen/mdYewmv...

StarPlatinumSan

5/15/2024

Learning curve for PHP, Sass/Scss and jQuery

Hey, for personal reasons, I need to learn at least how to hold myself using these 3 technologies, I was wondering if it was doable in a 2 week span and what is the learning curve for each one of them. I do know some fair level of Javascript and CSS. Also, is there a difference between sass and scss? Finally, does WAMP come together with PHP? Thank you!

salentipy

5/15/2024

Frontend Mentor - Workit Landing Page

I have searched for things (and searched for things) to fix two issues with this project. 1) the bottom of the top (dark) portion should be curved, as in the example and 2) the image should span two sections, as in the example. I've looked around at and/or tried clip-path and border-radius and possibly more for the curved bottom. I tried absolute positioning for the image, but that extended the top for the whole length of the image. https://res.cloudinary.com/dkxyiogil/image/upload/v1715807255/image-founder_s5sfn5.webp...

theboyduddus

5/15/2024

importing file problem

Can someone explain to me why am I getting this error? Casing of ./UseBreedList does not match the underlying filesystem.

Roman

5/15/2024

Why nest container divs in section/nav/article elements?

This has likely been covered before, but it feels like a really generic thing to find with search. I'm making my way through "Build a responsive website with HTML & CSS" playlist and I saw Kevin nesting a container div inside other elements like <nav> <div class="container"> ... ...

Ragnar

5/15/2024

CSS and HTML Menu bar for cafe

How to fix this problem , cannot figure out not in an order as you can see

Mr Keithy

5/15/2024

Subgrid row min height effected by parent row gap

Hi everyone, I have been getting to know subgrid, by setting up some cards. I have a date field in its own row, as it is a single line and the font is small, depending where it is in the order on the card, it takes the height of the parent row gap, even when this is over ridden with a gap of zero on the subgrid. So my parent row gap is 2rem, and my subgrid for now is a gap of zero, my font for the date field is 1rem, i get 1rem of white space under it. If I switch off the parent gap or set it t...

snxxwyy

5/15/2024

grid-template-areas vs grid lines

Hey, could somebody please explain the difference between using grid-template-areas and grid lines and in what situations you’d pick one over the other. Thanks in advance

Power Coder

5/15/2024

collapsing margins

Hi! So I am on the “collapsing margins in action” part of CSS Demystified & am a little confused. Is the reason Kevin is saying the margins from the hero & hero_content are combining because the browser is adding a default padding-top to the hero section even though Kevin didn’t explicitly add one to it?

orchest

5/15/2024

Keen slider issue

anyone here tried keen-slider? Why does this example of scroll navigation of pages seem to be buggy? Like sometimes it takes a few scrolls before it activates https://codesandbox.io/s/github/rcbyr/keen-slider-sandboxes/tree/v6/navigation-controls/scroll-wheel-controls/react-typescript?file=/src/App.tsx...

snxxwyy

5/15/2024

custom properties over redefining general properties

Hey, would somebody be able to explain the benefits of choosing to lay out something like the example below with custom properties rather than redefining the general properties upon something like a state change, I've seen people recommend doing it this way. ```css .button { --button-bg-colour: #ffffff; --button-text-colour: #000000;...

MartynasXS

5/14/2024

JSON history - string vs object

I'm working with large json structures and have to keep a few steps of JSON history. I am wondering whether its better to just have an array with json objects or stringifying and adding the string to the array instead? My brain tells me it should be better stringified.

Metanoia

5/14/2024

js/react with postgresql

https://gist.github.com/deahlt/af8174390490dc9e61758b6347d69a9c im getting error 'order not found' and 'invalid order id' because of invalid Order ID format (it mistakes user id for order id), for example: Received user ID: 6643958de7980e98dda15b8f Parsed Order ID: 6643958 No order found with ID: 664395...

vachito

5/14/2024

animation scroll replace gsap

I need to know how to replace this done with gsap to native css, using animation scroll, who can help me? useGSAP( () => { gsap.to(".firstWord", {...

jay_volk

5/14/2024

Advice on best way to do equal height on this

https://sflece.net/ -- looking for some advice on this (the coming soon area).... I wanted to have the image/ece/nonprofit text equal in height to Coming Soon, bottom text area. I went with Grid, but had to use JavaScript to get equal heights on resize... what's a better/right way to do this? As you can see it's a mix of images and text and needs to be responsive...(long time listener, first time requestor of help)

snxxwyy

5/14/2024

Activating label to check a checkbox by pressing enter

Hey, clicking a label linked to a checkbox checks and unchecks the checkbox however if the label is tabbed on and you press enter it doesn't activate. When you do this on an a tag for example it works perfectly okay, how do i make this function work on a label? Many thanks.

cssBee

5/14/2024

issue in front end mentor challenge: product-preview-card

i build the front end mentor challenge: product-preview-card-component-main https://www.frontendmentor.io/challenges/product-preview-card-component-GO7UmttRfa but i have an issue with spacing (screenshot), i knew it come because of the height of image but how to fix that? this is the code : https://codepen.io/css-Bee/pen/abrOwWG...

Heisenberg

5/14/2024

Help: How to make something from an iframe stick to the bottom of the parent page?

Hi all, I am trying to solve a particular problem. I have a button on a page which has a property position: fixed, bottom:0 ...

asasinmode

5/14/2024

Min height of content, preferred of screen with max

I'm making a landing page and I want the first section to take up full screen (or more if needed for content and padding) but also have some kind of max height, it can be a fixed number or something related to screen width if it works (like max-height: 150vw) but at the moment I can't come up with anything. I made a codepen and at the moment it has min-height: 100vh on the first section and in screenshot 1 you can see it works as intended, it also grows to more than 100vh if the screen is smaller than content+padding. However, if I zoom out (screenshot 2) then it still takes up all of the screen (as expected with 100vh) and I really don't want that to happen. Is there a way to do that? I tried something like height: clamp(???, 100vh, 2000px) but I'm not sure what should go into the first argument of clamp, like ideally I'd want something like fit-content but it doesn't work....

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