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

samidev

5/5/2023

why im getting these errors ?

im learning react js but im getting these errors idk why ? can somebody help me ?? CODEE LINK DOWN BELOW https://codesandbox.io/s/suspicious-ritchie-6y2cx5?file=/src/components/ClassBasedComponent.jsx...

b_sups

5/5/2023

Issue with value not being passed down correctly.

Am still working on learning pagination. I am trying to use less repeated code, so turned my button click into its own function. When I click a number I can get it to go to the correct page, but when I use the previous button, it changed the current page to 0 no matter what the page is. The initial value is set at 1. I understand this means the function call is using the initial value. https://codepen.io/bsups/pen/xxypaWE...

arogersrenee

5/5/2023

Adding padding to SVGs

I'm using SVG icons with a border-radius to create a circle around them. When I add padding to give space the icons disappear. The only way I could fix was to make the icons smaller padding smaller. They look fine, but I would like better control over the size. here's al link to the repository if that's helpful: https://github.com/arogersrenee/huddle-landing-page-with-single-introductory-section-master TIA...

Sste

5/5/2023

Container with different size from others

I want all container with the same size here. However, the last one container (with the t-shirts icon) has a different size compared to the others. I believe it's because of the word length... How can I solve it? https://codepen.io/ssstephanyyy/pen/rNqYYqE...

Abdul Ahad⚡

5/5/2023

Center a text element staying responsive

https://codepen.io/ahad4387/pen/MWPrEJb I'm trying to keep the dark EXPLORE always in the centre while staying responsive. tried using absolute with % on left but it isn't really responsive. ...

interpod

5/4/2023

How do you approach height responsive website?

So i developed webapp in react + chakra-ui. I was developing it on monitor with 2160 height dimensions (either 4k or UHD). When i opened application on full HD monitor (1920 x 1080) everything looks so big. Header, Left and Right sidebar. Most of the time I was fusing on width responsiveness and this issue got me thinking. One idea I have i my mind is to use "em" unit everywhere (even on fontSize) and scale it on the parent using media query. What is you approach to something like this?...

kashyap_rajan

5/4/2023

How to create a gradient so that it is beneath the text but above the main background of container

I need to create a background as shown in screenshot. Now if I create a div with fixed height or width, or even I use pseudo like after and before how am I supposed to put the gradient thing behind the text but above the container main background? I've never done this kind of work before. z-index is putting the entire thing behind the container.

d0kefish

5/4/2023

Trying to understand @media

Why does this happen? https://i.imgur.com/Pme2KoH.gif When scaling the screen it seems to be working, but when I change the screen size, its very different. ...

Sste

5/4/2023

Problem with margin

Hi people 👋. I am having problem when I am trying to put the .quantity-category (which is the quantity of the product) aligned in the top right corner using margin, mostly because when I use margin, the container width increases as well, and I don't want this to happen. What is happening? And how can I solve it? https://codepen.io/ssstephanyyy/pen/rNqYYqE...

TrickShottasUnited

5/4/2023

how do i recreate this using flexbox.

https://youtu.be/Qez8SoJ_aso also how do u make a flex direction row items take up the entire height of their parent element without setting a hard coded height value...

b_sups

5/4/2023

Trying to figure out why node list is coming back empty.

Trying to learn pagination. In the prevButton I am trying to loop over all the buttons I created in the createNumberButton functions. The node list comes back empty. Is this because the way I currently have code order set up, the nodes are not created before I try refencing it? https://codepen.io/bsups/pen/rNqYvMV...

Muchis

5/3/2023

How to make text take full width of it's container?

Say the div have 300px of width, how would I set the font-size of the text, so that it would always take 100% of the width, considering the text is never the same length (the text is some dynamic titles that I generate, but never long, but still dynamic). Smaller text would have to have a font a lot smaller than the bigger text, etc

Mozi47

5/3/2023

Need help in designing the table

I created the table having 5 column, so on last column I have button, when I click on button the div should display and cover the whole row. The problem I am facing is, the div is only showed in the current 5 column, I want the div cover the whole row (tr) Design I want to achieve in pic;...

redtypoOooOo

5/3/2023

what is and why use block-scope const in js?

Hi, there. Below is the code example I encountered. It is my first time seeing const declared after a const. What are block-scoped const in js and why use them there? What would be the difference if the const declare globally? Thank you for your attention and help! ```/=============== SHOW MENU ===============/...

vince

5/3/2023

How would you structure this component?

Making a discord clone in html and css for fun, curious what tags you guys would use for this. Discord uses a div for the "Chat"/"Community" button, and then a nav for the individual channels. I think a nav is definitely the right approach, but I feel like there could be a more semantic way to approach the "Chat" button... now that I'm typing this, I just realized I could use aria for this probably... and now that I'm looking it up I can probably use a combination of aria-role and `ari...

TrickShottasUnited

5/3/2023

Internal Hyper Link Design

do you guys know how to layout good internal links to jump to different parts of the same webpage if you have a lot of content and don't want the user to have to scroll? i know how to create them but are there any good layout designs? i am making a course page for my final project and i want the course 2 have 3 topics. i want the user to be able to choose which topic and instantly jump there but i need an idea of how to make it look good. i cant find any examples to look at for inspiration with people using them, wikipedia uses them but wikipedia doesn't look appealing...

Mathies

5/3/2023

How to make sure grid-template-columns with repeat minmax function doesn't create a row with 1 item?

Hi! I'm trying to create a responsive grid with 4 items in it. This results in a layout that works very fluidly on every screen size. However there are screen sizes in which one of the 4 items gets pushed to the next row [image 2]. I'm fine with pushing to the next row, but Ideally I would like this to happen in a 2x2 [image 3] layout. Is it possible to create this using just the repeat function? I would like to avoid as many media queries as possible....

Naks

5/2/2023

How to create a 'recycled paper' background effect?

WIld one this - looking for help to figure out how to add scattered debris onto the background of a section. Basically the effect should appear like the random squiggles appear on a recycled paper. I have no idea if there is a word for it 😄 Refer to images on these pages to understand what I'm talking about: https://www.eekwi.org/activities/arts-crafts/make-your-own-paper https://www.onlygfx.com/old-recycled-paper-texture-jpg/ ...

CDL

5/2/2023

Each blocks in Svelte, can't seem to wrap my head around this block of code

```js <script> const colors = ['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet']; let selected = colors[0]; </script>...

I goon to clippy

5/2/2023

Tailwindcss vs CSS

I personally don't like tailwindcss but ive noticed that now a days alot of examples or videos seem to gravitate using tailwindcss, is tailwindcss just an overall better way to do styles ? why is everyone using it now?

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