Hi everyone,
I have designed this website, but for some reason when I go to the tablet view and mobile view 2 of the boxes overlap each other for some reason, I have checked all my elements but I have not figured out what is the problem!
Please help me to understand why ONLY THE SECOND AND THE THIRD BOX react like this
The overlap issue in your Webflow design likely stems from improper flexbox or grid settings, negative margins, or absolute positioning affecting only the second and third boxes in tablet and mobile views. Check if these elements have conflicting height, width, or positioning settings compared to the first box. Ensure they are inside a properly structured flex or grid container with appropriate row and column settings. Also, inspect their margins, paddings, and z-index values to see if they are forcing overlap. If using flexbox, try setting flex-wrap: wrap, and if using a grid, ensure proper row alignment. Adjust these settings in the responsive view to prevent overlap.
I haven’t investigated more deeply but on your Tablet breakpoint, reset your grid column and row to their normal values and it will flow naturally without the overlap problem.