hi there! 👋
Since you applied a huge margin on your #main_container
it gets squished on small and mid-size screens. If you want to center your content you can do it with making the body
tag a flex-container:
body {
display: flex;
justify-content: center;
min-height: 100vh;
}
you can declare max-width
on your container to prevent it from stretching the full screen-width.
Instead of putting the image in an actual div you can set it as a background-color
to the body tag.
Hope this helped 🙏
Good luck and happy coding! 💪
Marked as helpful
@mihainrs
Posted
Hey @kodan96!
I tried applying display:flex to the body but the image was part of the reason I had to resort to using such big margins. I tried lots of things and not much worked sadly.
I didn't know about the image being set as a background-color though. I'll look into it and see how that can be done, so really great advice, thank you!
@mihainrs
sorry, it's background-image
, not color. I went autopilot 😂
@mihainrs
Posted
@kodan96
Oh lmao all good haha, thank yu thank yu!