Cart drawer grid and image CSS

Retired Boards Appdev Store Design
,

Topic summary

Cart drawer layout and image sizing issues at wider viewports; seeking CSS guidance to fix overflow and increase image size.

  • Above 990px width, the cart drawer’s two-column grid misbehaves: the second column shifts off to the right and a horizontal scrollbar appears. Below 990px, the two columns display correctly.
  • Product images in the cart drawer remain fixed at 150×150 px despite attempts to enlarge them. The poster wonders if this sizing constraint is related to the grid overflow behavior.
  • Screenshots are provided and are central to understanding the layout problem.

Outcome/next steps: No solutions or replies yet. The request is open for troubleshooting advice on correcting the grid/overflow at >990px and enabling larger image dimensions.

Summarized with AI on January 5. AI used: gpt-5.
1

Hi,

I’m having a hard time fixing the CSS troubles that is causing my cart drawer grid to misbehave above width 990px. Underneath the 2 columns fit well, however when wider, the second column disappears to the right and a scroll bar appears below. How can I tackle this? I’m also trying to increase the size of the images but they always seem to get locked at 150px by 150px. I wonder if these are related. I have attached some images, thank you for any help!

Screenshot 2024-02-19 at 12.09.59.png
Screenshot 2024-02-19 at 12.09.59.png1150×832 38.3 KB

Screenshot 2024-02-19 at 12.09.51.png
Screenshot 2024-02-19 at 12.09.51.png1230×784 37.2 KB