Why Do I Have Scroll Bars On My Website When There Shouldn't Be?

I'm making a discord server website for people to find discord servers to join and make friends but, I dont know why my web page has a horizontal scroll bar. It also has a vertical

Solution 1:

It's this combination

position: relative;
left: 24.5%;
display: flex;

You've got a block level box, that's margin area is therefore as wide as its container, then it's shifted 24.5% of the width of its container to the right, making its right edge 124.5% from the container's left edge. That's always going to overflow the container horizontally.

I suggest using margin-left instead of left.