Automattic / Automattic/jetpack

Tiled Gallery: Oveflow issues in Classic Block

Open
#20,284 1 comment 0 reactions 0 assignees View on GitHub
[Feature] Tiled Gallery [Pri] Normal Bug
Dominant language
PHP
Stars
1.8k
Forks
898
Avg merge
1d 18h
Merged PRs (30d)
774

Description

### Steps to reproduce the behavior

1. Add a Classic Block
2. Use the media insert tool to add a tiled gallery
3. Preview or publish the page on a smaller screen
4. See error

#### What I expected to happen

I expected the tiled gallery in a classic block to show all the images in it on all screen sizes

![tiled gallery block](https://user-images.githubusercontent.com/7907292/123817692-5c624380-d8c6-11eb-91a7-59ff17301345.png)

#### What actually happened

At some screen sizes images are cut off on the right, overflowing the gallery and are not visible.

![classic block tiled gallery](https://user-images.githubusercontent.com/7907292/123817728-65531500-d8c6-11eb-885b-6cc730024b7e.png)

### Context

User reported the issue in HC-29437765

#### Is this specific to the applied theme? Which one?

Repeated the issue on Simple and Atomic with both Baskerville 2 and Twenty Twenty-one.

#### Does this happen on simple or atomic sites or both?

Both

#### Is there any console output or error text?

Yes:
![tiled gallery console errors](https://user-images.githubusercontent.com/7907292/123821695-a13ba980-d8c9-11eb-8f9f-aa57c9bb1807.png)

#### Level of impact

All WordPress.com sites and WordPress.org sites that use the Tiled Gallery feature in a Classic block

#### Reproducibility (Consistent, Intermittent) Leave empty for consistent.

#### Screenshot / Video: If applicable, add screenshots to help explain your problem.

Contributor guide

Open the contributing guide

Research direction

Reproduce the issue by adding a Tiled Gallery through the Classic Block, then preview or publish it on smaller screens using Simple and Atomic sites with Baskerville 2 and Twenty Twenty-one. Compare the gallery at affected screen sizes and use the reported console output and screenshots to guide the investigation; done means all images remain visible without right-side overflow.

Written by the indexing model from the issue text.

Assessment

Tech stack
php, wordpress
Domain
frontend, web-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.