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

Cryptojihmee

5/22/2023

Background color sizing on img hover

Is there a way I can do something like this as it’s done on Google page whereby the background color is really larger when hovered on the icon??… I can’t find a way around to do it as mine is just taking the size of the icon img on hover. I have placed my codes here but the images doesn’t show up as I have it on my local directory here. I also don’t know how to make it show up here! Can someone help on this??...

bibamann

5/22/2023

flex or grid columns based on (modulo) number of Items

So, I'm on a CMS / frontend where the content team can add a collection of cards (like: this is our contact team, these are our sponsors, ...). These cards are listed by default with max 4 cards in a row. Then the next ones in the next row. Now, here comes the problem: It looks WAY better when if you've got 5 items you don't show 4 in the first row and just 1 in the last. But display 3 in the first one and 2 in the last....

Spiritual Tech

5/22/2023

Cross Browser testing

What is the best cross-browser testing environment to use? I have used Lambda and Browser Stack and both are subpar.

Mozi47

5/22/2023

Flex grow issue

I am trying to grow the div when clicked. Its working fine but when add the content then its not working. https://codesandbox.io/s/clever-christian-7unckn?file=/src/App.js...

hashirhehehe

5/21/2023

Flexbox help needed

Hello I have created nested flexboxes and made a layout but there is problem I am not able to fix that, the nested flexbox when is applied then the in container styles of :hover are not working can anyone please help me in this?

b_sups

5/21/2023

Anyone know a good Parallax course?

I tried doing one on Udemy, I wont say which. But it was more of a course where the person was proving they knew how to an expert rather than teaching people who want to learn.

5/21/2023

Any good reason to continue jQuery?

I have been too much adjusted to jQuery eventhough es6+ is an option, the animations are so easy to use... I have also been trying to replicate jQuery any suggestions? BTW the jquery min js would be fast enough right?...

Avinash

5/21/2023

Anyone know how to fix this issue in react?

so i created react using create-react-app and installed react-icons and react-router-dom google search answers didnt work

Malik

5/21/2023

Download button

How to make a download button that starts downloading the content as you click it. I tried anchor tag with download attribute. But for me it just opens up in new tab. As i've seen on multiple videos on youtube their content just starts downloading & they're not using any javascript or anything. Would like to get some help on that.

//doesn't matter if it's image or pdf they all open in new tab.
<a href="./my.pdf" download>Download</a>

//doesn't matter if it's image or pdf they all open in new tab.
<a href="./my.pdf" download>Download</a>

...

Avinash

5/21/2023

How to make image start from top of the div and add border radius?

https://codepen.io/avinash-tallapaneni/pen/dygGrjR parent div of image is positioned display:absolute to its parent. so setting display:relative to the parent wont work. How should i proceed? Also since im using object-fit:contain how should i add border-radius to the image?...

Aditya Kirad

5/21/2023

not able to overflow the div properly

hey folks I have this html ```tsx <Box display='flex' height={'calc(var(--vh, 1vh) * 100)'}> <NavbarLayout /> <Main>...

Silvershot

5/21/2023

Margin auto not working

in the picture below, blue box is my root div container inside the body. it is the only body child.(react app). - the root div is flex with flex direction column. justify content and align items is set to center - red is a main element with flex grow 1. it spans the whole height of the root div container. red box is NOT a flex container itself, but has a margin set to auto to center it horizontally and vertically. yes i know i can use justify content and align items on the root, but this is my setup right now. - yellow box is a div which contains stuff denoted with green. it has its margin set to auto, just like its parent(main). ...

Blackwolf

5/21/2023

Which is the best way to present CSS?

Both of the following divs are identical, but I have seen both methods of applying CSS. Most people seem to teach the former, but the likes of Amazon and Facebook use the latter. Just wondering if there are any advantages to either. Maybe admin could create a poll to see which is most popular 😄 ```<style> .containerOne { width: 100px;...

Monimolimnion

5/21/2023

CSS only Twitter/Whatsapp style image grid

Is it possible, using just HTML and CSS, to create an automatically adapting image display element for between 1 and 4 images? e.g. a square 2 x 2 grid: if there's one image , it just shows 1 square image covering all 4 cells. If there are 2 images, 2 1x2 rectangles side by side. 3 images, 1 1x2 rectangle and 2 1x1 squares, and 4 images, 4 1x1 squares....

MarkZubark

5/20/2023

Text Transparency

How do i archive the text transparency in the picture

sebin

5/20/2023

Should I seperate CSS Files?

whats the best solution when using clean css. I have 1 page of html which consists of 6 sections. should I seperate the css files on each section? or should I just put it all the css in one file.css?...

Trazos

5/20/2023

input tel help js

https://codepen.io/AnthonyBAC/pen/yLRQvNV code hello !! I was trying to make this input, and everything turned out fine until I saw that the cell phone contact number in the input changes it to the landline phone number (home) of my country, what i need to do to make show the +56 number instead of (2)...

M@HeR

5/19/2023

drag and drop react

How i can to devide the distination line when i drag the source element side element in desitnation dynamically and if row of distination the element take full with like this picture

thehumanist

5/19/2023

Problems with smaller screen layout causing pages to disappear into vertical negative space

Sandbox: https://codesandbox.io/s/focused-blackwell-ongpok I am having issues with my site. Once I switch to smaller screens and the site adjusts from my media queries... my About and Portfolio sections, which I want to just scroll, suddenly are disappearing up into the negative vertical space above the browser? Curious why this is happening and what I can do to fix it? ...

Å Marlon G

5/19/2023

React export

Hello! This is taken from codecademys intro course to React. In the app.js file, this code example is used: ```js...

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