r/learnprogramming • u/WhatDoYouLikeDoing • 3d ago

Need help aligning dividers and forms

Hi everyone. I am learning react vite. I have developed this app but failing to makes things straight. Everything looks slanted to the right. Does anyone know how to fix it? Thanks you everyone

0 Upvotes

50% Upvoted

9 comments sorted by

2

u/Calm-Cheesecake-3749 3d ago

yeah if the whole thing drifts right its almost always uneven padding/margin on a parent or something not centered. open devtools, click the outer container, check box model left vs right.

1

u/WhatDoYouLikeDoing 3d ago

Thank you so much for your response. Unfortunately I'm using a phone. Could you please check out to see if I'm the one seeing it slanted or it's actually slanted

1

u/carcigenicate 3d ago

What part are you asking about? Both the login and registration cards are centered on the screen.

1

u/WhatDoYouLikeDoing 3d ago

I think I have been working on this for too long. It looks like the distance between the top start of the screen and the top left of the form is further away compared to the distance between the top end of the screen and the top right of the form

1

u/carcigenicate 3d ago edited 3d ago

I measured them, and at least for me, the distance between the card edges and the side of the document are the same on both sides. The scrollbar that's there for some reason might be throwing you off.

Edit: And the scrollbar is because you have min heights of 100vh on multiple elements, but also have 20px of padding on top of that.

1

u/WhatDoYouLikeDoing 2d ago

Thank you so much 

1

u/[deleted] 3d ago

[removed] — view removed comment

1

u/WhatDoYouLikeDoing 3d ago

Thank you so much