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

Spritzwerk

5/16/2024

Parallax container somewhere in the page

I have recreated the stunning parallax effect from @Kevin s youtube video "true parallax with css-only is now possible". And, what should I say. it looks great. But, it is just working on top of the page properly. I was wondering if I can create a container within this parallax effect, to bring it anywhere I want in my page. But I wasn't able to find a solution. Is it possible, and if it is, how?...

rayannn

5/16/2024

Struggling with creating layouts and using correct size units

I'm trying to recreate the hero section of this design. I've tried different size units from pixels,vh to % and i cant get the edges of the images to touch like in the design. I''ve made a div with 2 containers, 1 has the text and one has the image. I applied display:flex and they allign correctly but its not as pixelperfect as the design. What should i do to recreate the design? i've tried css grid and gotten the same results. I can look up the solution but for now i would like to figure it out myself with some pointers. Any advice would be appreciated. ...

ceyda

5/16/2024

navbar sub-menu doesn't function properly

I'm working on a website and in hizmetler.php page I have three section (2nd photo). When I click a title in that menu, the div related to that title shows and other divs hide. I want to add the same function to the sub-menu in navbar (1st photo). If I'm in hizmetler.php page, the navbar sub-menu works. But if I am another page when i click a title in that menu it takes me to hizmetler.php but to the default not the related div. And when I try to go there from index.php it doesn't go to even hizmetler.php. I am not that good at javascript/jquery so any help would be really appreciated. This is navbar code: ```html <header>...

griff

5/16/2024

how come my scroll watcher's width is set to 100% but doesn't fill 100% of the DOM?

Eighth

5/16/2024

Bitwise operations

Please help me solve the task, I can't make it shorter than 38 characters. Maybe someone understands code golf. Given a natural number x, it is less than 2 to the power of 31, return 1 if at least 1 odd bit of the number = 1, otherwise 0 if the numbering starts from the right with 0 and the rightmost bit 0 has a black position. Condition (code no longer than 23 characters)

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!

Jules (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", {...

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