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

I need help how to slice a div in half when using clip-path polygon

So how to solve this i thought clip path polygon reshapes the entire thing but i was wrong it doesnt seem to do it and my web is overflowing
No description

Need Help Setting Up NextAuth with Facebook Provider

I'm encountering difficulties setting up NextAuth with the Facebook provider. Here's my current situation: - I have a verified business account running in live mode. - I need to set up login with Facebook functionality. - Testing in localhost gives me the error "Insecure login blocked. You can't get an access token or log in to this app from an insecure page. Try reloading the page as https://."...

How to filter a nested array and render it with js.

GitHub: https://github.com/Saf98/mega-menu-vanilla/blob/main/src%2Fnav.js Project details: build a vertical column mega menu using JS. What I have done so far: ...

How important is keeping a build plan structure?

I plan on starting my memory card game in React today and have written out the steps of how the game works in psuedo. I'm not really sure how to code the first initial part of the game, but I am fairly confident that I can code the actual game itself (click a card, if yes, add a point, randomly roll cards again, if fail -> game over). I figure if I code what I know I can do, I can then slot in the rest afterwards? or should I try and keep to coding from start -> finish? previously I've done start -> finish (For the most part), and it drags out a long time until I'm able to get help on where I'm stuck....

How to make the image clickable?

I'm currently learning JavaScript on scrimba, and I use chatGPT, didn't work well. HTML: <div class="questions"> <div class="question1"> <span> What is Frontend Mentor, and how will it help me?</span>...
No description

Help with "A new approach to container and wrapper classes"

I'm watching Kevins video https://www.youtube.com/watch?v=c13gpBrnGEw and am trying to add a breakout to a particular paragraph and it isn't working. I have other instances on the page, both above and below it which are working. I've been playing around with it for a while and can't seem to figure it out. Heres a link to my codepen, the offending paragraph also has a class of call-to-action and has a white background. Thanks for any and all help! https://codepen.io/thisispeterj/pen/ExMVxor?editors=1100...

Handling CSS Grid cell text content overflow in a flexible ways

I have a CSS grid cell which contains a randomly changing text of different lengths. When the text is too long and displayed on Mobile (like Androind circa 450px width) the long text is cut-off. the 2 challenges are the below, really appreciate in case anyone has wisdom / advice: 1. Can text wrapping or overflow be done in such a way that the text occupies more cells below? This would prevent the cell height change which causes other cells above it to bounce up and down with long and short text which is not desired....

Sass Error: Module loop: this module is already being loaded.

```Error in plugin "sass" Message: scss/main/tools/functions/_gutter.scss Error: Module loop: this module is already being loaded. ┌──> scss/main/tools/functions/_gutter.scss...

Building an open source streaming website for movie dram manga manhua manhwa etc

Ok so I need help I am an extreme noob when it comes to code and I need help and wanted other developers to join in on my works and I am facing problems and can't find exact solutions to it sooo here is the code/entire repo with the web for reference to my problems https://github.com/its-19818942118/OpenPlexer/ https://its-19818942118.github.io/OpenPlexer/...

JavaScript Course Suggestion

I'm really into learning full-stack web development right now, with a big focus on getting really good at JavaScript. My goal is to eventually move on to a JavaScript framework once I've got the basics down. To help me learn, I'm looking for a good course that teaches the JavaScript stuff you need for full-stack work. It should be for total beginners and explain things in an easy-to-understand way. I'd like something short and sweet, less than 30 hours - I don't want to do a super long course li...

Issue with img sizing in lighthouse

Does anyone know how to fix this? When I remove the higher resolution images for the DPI I get this.
No description

Photoshop slice tool to HTML - website creation

Hi, I just started learning about HTML last month, but due to my health problems I missed almost all classes, theory ones included, therefore I have no clue how to create a website, no access to Photoshop, and little time to figure everything out. Can someone help me?

page width extending

i'm in the beginning process of starting my page, though i saw the width is overflowed and extended. i can't seem to spot what or where is making it overflow. would anyone know how to fix it?
No description

Having issues with scale property on hover

Hello! I've found myself unable to fix this weird blurring that happens to the card's text and image when I hover over and apply the scale property....

Having issues with Responsive Web View and Javascript hover property

Hello, Please I'm having issues with the responsive web view of my portfolio. It seems as if the view screens are better with margins and paddings than with putting a width on the elements. This problem is occurring in the projects section(I used percentages for the width). I also don't know why my Javascript is not working on the hover property in the project section. Live site : https://kenes-portfolio.vercel.app/ (edited)

Making an image take the height of the div it is inside of

Problem I want the image on the right (yellow outline) to start shrinking down if the red outline div height shrinks. Currently the yellow outline image height is taking priority, but I want the red outline div to take priority so the image inside it shrinks. ...

on Chrome, transformed img is flickering if an element has background half-cover it

I'm building a 3d gallery, everything works fine until the sticky menu bar appears. The images under the menu bar is flickering only on Chrome. Here's a video:

After I've added <!DOCTYPE html>, everything became buggy

Please, can someone help me on codepen? I'd like to learn how to fix this problem and to fix my website. I'm working on this uni project and I'm making a website. I forgot to put the <!DOCTYPE html>, but after i've added it, everuthing became buggy, like, the background image it's too big or too little and repeats itself, the buttons are bugged, when I click one, everything on the screen moves down, I've tried to work on the dimensions of the css elements, but nothing changes

Nextjs Layout

Hello, I want to ask about a way to remove the root layout from displaying in a certain component file, I tried many things but tge root layout keeps displaying, how can I achieve this?