UI/Layout Bugs

This page contains various UI and layout bugs for testing purposes.

Bug #1: Broken Grid Layout

The grid below should display 3 columns on desktop, but has CSS issues.

Item 1

Item 2

Item 3

Item 4

Item 5

Item 6

Bug #2: Overlapping Elements

These elements should not overlap but have z-index issues.

Box 1

Box 2

Box 3

Bug #3: Responsive Design Issue

This container should be responsive but breaks on mobile devices.

This div has a fixed width of 1200px and doesn't resize on smaller screens

Bug #4: Text Overflow

Text should wrap but instead overflows the container.

This is a very long text that should wrap nicely within the container but instead will overflow horizontally because there is no proper word-wrap or overflow handling in the CSS and the container is too small to fit all this content.

Bug #5: Misaligned Flexbox

These items should be centered but are misaligned.

Flex 1

Flex 2

Flex 3