Gallery Live Preview img width css

[cramdesign]

The live preview for galleries uses percentages to define the width of .gallery-item. It would be more elegant if .gallery img used:

max-width: 100%;
height: auto;

Looks like this should be in wp-content.css around line 337.

The widths of gallery-items could also be more precisely set if padding were used for separation rather than margin. This would require the use of border-box sizing however.

I have these changes tested and they work. A side benefit is that a horizontal scrollbar is no longer triggered by the gallery images when they overflow.

The captions in galleries with high column counts can get super narrow and the type distinctly ugly at narrow sizes but the only fix would be to reflow the columns in a responsive fashion and this is not the intent of the preview.

I would love to submit a patch but I haven't a clue with svn and barely a clue with git.

[SergeyBiryukov]

I would love to submit a patch but I haven't a clue with svn and barely a clue with git.

Take a look at ​http://make.wordpress.org/core/handbook/working-with-trac/submitting-a-patch/.

[cramdesign]

Well, creating a patch file nearly defeated me and I'm not certain that I did it correctly. Hopefully some kind admin will delete my errors and extraneous files.

[azaozz]

In 27578:

TinyMCE:

• Update the styling of the image caption and gallery toolbars.
• Fix issue where the hidden clipboard div in wpView.
• Switch to using the pencil dashicon for Edit.
• Add max-width: 100%; to images in the gallery preview and adjust column widths.

Props cramdesign, mattheu, gcorne, melchoyce, see #27320, fixes #27376, fixes #27354