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

Doksuri

10/17/2024

how to document.createRange().createContextualFragment(html) in a service worker ?

i'm working on a web extension, and it does a fetch. the result is the HTML, and i want to search elements in that HTML. usually, i do a createRange().. in order to be able to querySelector(). but since it's in a service worker. i don't have access to the document. how can i manage this ? thanks. here is my 'not working code'...

Arem Daesh Aref Slash

10/17/2024

Design Dynamic "Panel" component approach?

1. The panel shows one of many "views" depending on it's state. 2. Each view presents information and may interact with user 3. Any of the views can alter the "panel" state, trigger events 4. Panel responds to state change and events to possibly swap the current view with another 5. Implement using using only javascript/html/css - no frameworks...

chasingtheflow

10/16/2024

Beyond CSS: Product Cards Project

In the HTML video for the Product Cards Project, Kevin lays out the html for the Product Cards at the top as well as the "Category Cards" (or link with image cards) at the bottom inside divs. I had attempted the CSS on my own before watching the video and I had chosen to use unordered lists for this. Is there a reason div's would be preferable here that I don't understand?

snxxwyy

10/16/2024

class questions

Hey, i have a few questions about classes given this code: ```js class Message { constructor(message) { this._message = message...

snxxwyy

10/16/2024

classes | constructor, super, get & set

Hey, i just want to double check some knowledge and ask some questions regarding these topics since i don't really understand them. 1) is constructor a way to pass external values when creating a new instance of a class to this. values? If so, when you don't need to do this, does it need to be added? 2) what does super do? the mdn docs say it allows you to access properties on an object literal or class's [[Prototype]], but what does this mean? Is it that it allows you to access this. values from the original class if another extends it? 3) the mdn docs say the get and set functions allow you to get and set this. values. Does get only allow you to return a value and set only allow you to change it or can other things be done within these?...

FryBlaster

10/15/2024

Make right sticky card disappear when it's close to the bottom

Hi everyone, hope you're doing fine! 🙂 I'm struggling in finding a way to make what the title said. I have a container with two columns where I have in the right column a sticky card that I want to disappear before it touches the bottom edge of its wrapper (I put a border around it, so you can see better what I mean. Here's the codepen for a small demo: https://codepen.io/fracav99/pen/QWejpqE?editors=1100...

luca

10/15/2024

How to Extend Background Color Across the Entire Row in My Opening Hours Table?

How can I modify my code so that the green background color covers the entire row for the selected day (like Tuesday in the example)? Because now there are white space gaps. Here's a link to the CodePen: https://codepen.io/lccua/pen/LYwWBjd

smackalpha

10/15/2024

How to make bottom shadow in text in css.

I have a text and it looks like in pic. I want to make like that in css. I tired textshadow and box shadow. but i can't achieve that design. Can someone help me with this.

snxxwyy

10/14/2024

columns vs flex/grid

Hey, when should you use the columns property over grid/flex for a column layout? I know there’s that one use for masonry type layouts with the columns property, but in terms of general columns, i believe i saw somewhere that you can use minmax or something along those lines with columns. So are columns recommended for general column layouts as i say, with grid/flex being used when you want extra functionality, or should you stay away from it all together?

Code-S ♛

10/14/2024

how do i get this image purple

As you can see in the design the image is purple but the image given to me is black and white and i want to coor it like this how do i color the image purple?

snxxwyy

10/13/2024

async function/promises vs try and catch

Hey, what is the difference between an async function/promise and a try and catch expression? To me, they both seem to be similar due to the error handling, i don't really get the use of the async function in this case, can someone please explain? Thanks in advance.

Arctomachine

10/13/2024

Take full width in single column grid

I want to create grid layout where: - 1 or 2 columns - if there is enough space on screen to fit 2 items at 350+ px each, then use 2 columns and stretch items to 50% (of grid container) - if not enough, then use 1 column and stretch item to 100% - but not limit item to 350px (let it further shrink on screens below 350px wide)...

roger

10/13/2024

how is this form can be between two divs

I don’t know how to achieve this particular space diva

Code-S ♛

10/12/2024

How Do i approach this border

you can see it has a weird border any ideas how can i make that?

???

10/12/2024

Help on Ticker

im very new i just need to create a ticker thats seamless, I tried to create one but it animates fully and leaves a gap in between and when its done only does the next one start. using html n bootstrap

AMAN

10/12/2024

How do i put a span a absolute div across the whole page not just 100dvh the entire website

The div simply ends at the viewport height. I have attached the code. Sorry, but I don't know how to post snippets correctly.

R.I.P

10/12/2024

slow animation on corners

https://codesandbox.io/p/sandbox/kind-joliot-5jrqyn go there and u can see that it speeds up on corners so how can i change it? anyidea is acccpetable no boundaries and i dont want just 1...

Ma-Kas

10/12/2024

Vertical writing-mode figcaption refuses to shrink past certain point

Got a banner component with a vertical figcaption (thanks designers). It's normally part of a bigger component, but I simplified it for the issue display (so excuse any seemingly unneccessary extra tags and classes). The figcaption should always take up a % of the parent's height (=the image height). I can't hardcode any sizes, as all content comes from a cms and is only known at runtime. Things work, but the figcaption refuses to shrink past a certain, seemingly random point. To check issue: run the codesanbox, open preview, shrink preview window. https://codesandbox.io/p/devbox/3z3qjm...

Code-S ♛

10/12/2024

Padding nor margin being applied

https://codepen.io/saad-shehzad-the-bashful/pen/mdNRqmg idk why the padding nor margin is being applied to the gabriel_fancy_text i can give margin or padding to the bottom text but i just want to know whats the problem in applying it to gabriel_fancy_text...

10/12/2024

How to create a similar tab selection effect in react.

I'm trying to create a similar react component to what is found on the home page of fxpro.com here's what I have so far https://pastebin.com/raw/Y79EkXkQ...

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