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

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?

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

Title. Please, can someone help me on voicechat or 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

How to fix this last question image?

Anyways to fix it? HTML: <div class="question4"> <span>How can I get help if I'm stuck on a Frontend Mentor challenge?</span> <img src="icon-plus.svg">...
No description

How to straighten these rows?

I have cards with rows of data that may have variable length text. Right now, each div within a row, within a card, is independent from the other divs on the same row but in a different card. How do I make these grow to the tallest div in each row? https://codepen.io/Jason-Cabreros-the-sasster/pen/NWJwxWR...

Nav Drop Down is appearing at the bottom of my page

Beginner here Im trying to create a responsive nav bar but I have been having alot of issue with the media screen part, when my nav list pops up it appears at the bottom of my screen.

How do i add such caret in my website ?

https://monkeytype.com/ It is using event listener and moving caret on each letter type but the problem is how do i find specific width for each letter cuz all letters don' t have same width, I thought of alternative approach which is adding ::after pseudo property but doing this i will not get the caret move effect like in above website....
No description

Responsiveness tips!

Hey i’m 15 days into CSS, i do struggle with responsiveness alot as i always start with desktop design and try to fit it into mobile, also i don’t use media queries, i just stick with basic responsiveness code. So any tips to maybe avoid some errors or some best practices would be appreciated!...

How to handle responsiveness of an image ?

Hello, I'm trying to handle the display of an image on the hero section of a website. It's a simple two column layout, with text and CTA on left, and an image on the right (for laptop and desktop) and a one column layout for mobile and tablet with title - CTA - image. I would like my image to grow proportionnaly to the resolution, but I don't know how to do it ? For mobile I have this for the moment (cf image). I have a max-height on the image. So the problem is for tablet my image isn't the biggest it could be ...
No description

Text and Images

What is the best way to put text on the side of an image, I'm not sure which the best to use. Do I use float? or grid? or flexbox? especially when it comes to responsive layouts. Would appreciate your guys take.

Animation text

Can anyone tell me how to make this animation? Thank you so much

REACT JS Error

Guys why Do I get the Error Under My Function Parameter even if the result shows Up correctly
No description