Design comparison
Solution retrospective
I have a question --> why does my file looks different in edge and different in google chrome .
in edge my files looks prefect but in chrome my files looks different its like look everything goes up .
why does it happens ?
i don't know it happens on only laptop or anyone else also so please, preview my solution if you see this so. Please give me feedback .
OR
if u know why its happened , then please let me know about this also and also u know how to resolved it , so please help me also to resolved it .
Community feedback
- @khannfouadPosted 5 months ago
The issue is most likely coming from the 70vh you've set on the container. Different browser's view ports react in different ways when vh is concerned. Also it's a funky property that's why I like to avoid it.
Solution will be to add a max-width property. Use 100vh on the body to center the container div. and remove height altogether from the container. Let your margin and padding handle the vertical length.
Marked as helpful0 - @OmprakashRPosted 5 months ago
Hi @ritujha19,
Great job on your project! I have a few observations for your code that might help improve it:
Add min-height: 100vh to the body to center the div. Remove the vh value and replace it with px values. Set the height to auto, and use max-height and min-height properties as needed. Additionally, remove the top margin. Hope this helps!
Thank you!!
Marked as helpful0
Please log in to post a comment
Log in with GitHub
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord