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

Saika

3/20/2023

How to design a page from jpg design file?

Hey. I am trying some frontend mentor challanges, but it comes with just a .jpg file showing how it should look. Whats your best app to detect pixel sizes or to make it work like in cssbattles where you can drag a line showing what to change? (I am using Windows 10 if that matters)

bengr

3/20/2023

`CSS.supports` not working for `transition-property: grid-template-rows`

I'm trying to implement a Collapse/Expander element using CSS Grid by animating grid-template-rows. However, I need to know if it's supported first, but it seems like CSS.supports always returns true for transition and transition-property. e.g. ```js CSS.supports('transition: grid-template-rows') // true CSS.supports('transition: grid-template-rowssss') // also true CSS.supports('transition-property', 'grid-template-rowssss') // also true...

winniffy

3/20/2023

javascript function not executing

please, can anyone help check this code snippets linked below? i have two functions in particular not executing:

1. displayCurTime()

1. displayCurTime()

2. displayMin()

2. displayMin()

...

Hoshi

3/20/2023

Scroll animation overlapping not letting me interact with a button

Hi! I made a scroll animation with GSAP (over a year ago so I might not be remembering something), some sliders that appear and disappear with scrolling. The thing is for some reason only the last one is reachable, you can only select text or interact with the last one, because inspecting it seems to be above the other ones all the time. I need to put a button in other slider that is not the last one and I can't press it, I tried adding z-index: 999 to the button but still nothing, does anyone have a solution to this? Here's a codepen as an example...

JunSu-Ho

3/20/2023

Bubble effect in CSS

I wonder how to replicate the exact same result as in the original picture I try inner shadow, but when I increase the blur it's spread all around the circle, meanwhile here top-left, and bottom right are clearly transparent, also with linear-gradient is not quite the same...

Abdul Ahad⚡

3/20/2023

Carousel from a masonary grid

I have a masonry grid. When I click on any image I want to open a carousel. with pagination. I'm using vanilla js. Is there any library I can use to achieve this? Sorry if this is very basic question....

Tok124 (CSS Nerd)

3/20/2023

Convert script from jQuery to Vanilla JavaScript

Hello. I was wondering if anyone could help me to change this jQuery AJAX Script to vanilla javascript. I don't really feel like importint a whole library to use only AJAX for my forms so i would appreciate it a lot if someone could help. ```js $(document).ready(function() { $('.myForm').submit(function (event) { var data = $(this);...

Cocoman

3/19/2023

Customize input pattern not matching popup

Is there any way to customize the popup that appears when input does not match pattern?

vert_Nk26☑

3/19/2023

The problem is when i click out side the box the burger me

https://codepen.io/Vert-Nk26/pen/wvExNqB

Bawdy Ink Slinger

3/19/2023

Responsive grid column count w/o using media queries?

I want a responsive grid where columns shrink and grow to fill the container: on small viewports, I want one column; on medium viewports, I want two columns; and on large viewports, I want a maximum of three columns. This is easy to do with media queries as shown here: https://codepen.io/academyoff/full/xxaJabZ But is there a way to achieve this without media queries?...

Avinash

3/19/2023

How to update HTML text via javascript without distrubing css

i been using certain properties like innerText to update HTML text but for some reason CSS (font color, size etc) is not applying on those text. How to fix it?

WebMechanic

3/18/2023

filter breaks positioning

I recently ran into an interesting phenomenon where applying a CSS filter nuked the absolute positioning and size of a child's pseudo element and made it collapse to its intrinsic size I was wondering if this is a "known" bug/behaviour in Blink/Chromium and Firefox (unexpectedly appears to work in WebKit) or if I missed something fundamental about stacking contexts, positioning, containment and alike that non-WebKit browsers need for this not to break. Here's an excerpt that depicts the issue when you hover the card (left card ok, right card broken):...

WHIZZBBIG

3/18/2023

Selectors Hell

I am trying to select specific li of the ul of a div which is looking like a hell if they're simillar ones ```html <header class='header'> <div class="inner"> <div class="buttons">...

Eighth

3/18/2023

What nesting is correct?

Please tell me if it is possible to nest buttons in nav or li. Let's say I make a header menu and want to make a burger button, then should I make an additional shell and insert the button there along with nav, or not?

Avinash

3/18/2023

Javascript API's issues with combining geocoding API with openmetro api

context: i have 3 ways to get location. one is by using inbuilt navaigator.geolocation which gives lat and long. second and third option is same with slight variation that is by typing location name in the field input and then either by clicking "Enter" key or click on searchbtn. All are working as intended. The issue is the API (OpenMetro) which im using (cause its free and doesn't require credit card) has few api. one specific Api will return all the weather related information based on lat and longitude but doesnt contain name of the city or country. just bunch of data related to weather...

samidev

3/17/2023

can someone fix this one for me ? it is made with jquery but can someone fix it without it ?

samidev

3/17/2023

how to make responsive cards ?? and put em in center

code in this link : https://codepen.io/ssamimustafa/pen/NWLBKYb

Ali

3/17/2023

AI suggestion

How can I implement such this auto complete in CSS/JS?

glutonium

3/17/2023

getObjectFitSize()

here the person talking about the getObjectFitSize() but i did not find anything about in on the internet.. any idea what it is???...

Hmm

3/17/2023

Underline animation

hey , I want to add underline transition but its not working https://codepen.io/tribhuwan-joshi/pen/mdGqqYy?editors=1111 using tailwindcss...

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