Automattic / Automattic/jetpack

Tiled Gallery set to 0px width/height when child of inline element

Open
#898 7 comments 0 reactions 0 assignees View on GitHub
[Feature] Tiled Gallery [Pri] Low [Status] Auto-allocated Bug Good For Community
Dominant language
PHP
Stars
1.8k
Forks
898
Avg merge
1d 18h
Merged PRs (30d)
774

Description

After hours of banging my head against my keyboard, I was able to diagnose what I believe is a bug with the Tiled Gallery sizing JS. I think it may have possibly been related to [other issues reported in the past](http://wordpress.org/support/topic/jetpack-tiled-mosaic-gallery-not-loading-all-images-1?replies=40#post-5067158) that weren't solved. I think I've seen this before too.

When a gallery is the immediate descendant of an inline element,\* I believe the [JS that finds the parent item's dimensions](https://github.com/Automattic/jetpack/blob/48175fbf8e802b6c1bda2eed798d5e72254df748/modules/tiled-gallery/tiled-gallery/tiled-gallery.js#L74) gets a width and height of 0 from that inline element and then sizes the gallery to match—adding inline styles of `width: 0px; height: 0px;` on a bunch of elements in the gallery and effectively making it invisible.

Setting the `` to display as a block element immediately made the gallery appear.

\* In my case, I was using a `` for inserting schema markup which strikes me as a valid usecase.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.