~MARSMAN~ Comments - Answer Overflow

~MARSMAN~

•Created by Zach on 1/18/2025 in #front-end

How do people degug overflowing elements that overflow other elements?

Yeah, sometimes you gonna have to find the culprit the hard way 🙈 But I always blame the images first lol, because they're the ones I mainly set width for them.

6 replies

KPCKevin Powell - Community

•Created by Zach on 1/18/2025 in #front-end

How do people degug overflowing elements that overflow other elements?

If I would take a wild guess in this case... The first suspect for me would be the image. If you're setting a width of 100% to the image, then check if its parent has a set width, and then the parent's parent, and so on till you reach the parent that doesn't have a width. Because for me it looks like the image is taking the body size, the outermost red border ( excluding the image's parent ), since it can't take an ancestor's width.

6 replies

KPCKevin Powell - Community

•Created by Faisu0p on 1/11/2025 in #front-end

Need Help with Multi Step Form Submission - specifically handlePreviousStep Function()

And if you go back from a previous step to the current step again, you will lose all the data you entered. It's because you're re-rendering/rendering each step conditionally. So going to the next step will cause the previous one to unmount and thus the data it had will be removed. I have 2 ideas in mind to fix this: 1- Pass the projectData as a prop to each step, and then fill that step's form inputs values based on their name and the corresponding key in projectData. 2- if you're just wanting to make it multi step form mainly for the UX, then I suggest you to use CSS display: none; to hide the steps, and only display the current step. Maybe add a class of "active" when a step is the current one. I'd do something like:

<Step active={step === 3} />

<Step active={step === 3} />

And then pass that active prop to:

<div className={`active ? Styles.show : "" `}>

</div>

<div className={`active ? Styles.show : "" `}>

</div>

4 replies

KPCKevin Powell - Community

•Created by Kivory on 1/9/2025 in #front-end

How do I make an animation where a div goes from height: 0px; to [its regular height]?

The codepen Chris shared is what I use as well Give it a shot, it's a really good solution.

22 replies

KPCKevin Powell - Community

•Created by Kivory on 1/9/2025 in #front-end

How do I make an animation where a div goes from height: 0px; to [its regular height]?

you want something like this behavior?

22 replies

KPCKevin Powell - Community

•Created by roycwilliams on 1/8/2025 in #front-end

Why is the 4th image showing first in my GSAP scroll-trigger animation?

One way to do it is to give the first img a zindex of 5. This way it will stay on top of the last image whether the parent is in view or not. And its zindex will change while scrolling the parent.

5 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 1/8/2025 in #back-end

Cookie with expiryDate gets deleted once session ends

Thank you!

46 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 1/8/2025 in #back-end

Cookie with expiryDate gets deleted once session ends

done, changed it to expires with a Date. now I have opened and closed a couple sessions on different browsers, and it didn't get removed yet 🙉 I will keep testing it, and hope it's fixed now.

46 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 1/8/2025 in #back-end

Cookie with expiryDate gets deleted once session ends

ok, do you have any idea what's wrong in that part?

46 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 1/8/2025 in #back-end

Cookie with expiryDate gets deleted once session ends

decoding the cookie on https://jwt.io/ shows the expiry date correctly

46 replies

KPCKevin Powell - Community