Opened 9 years ago
Closed 9 years ago
#38872 closed defect (bug) (fixed)
Twenty Seventeen: Images in a Gallery within a post or page show different sizes in IE11
| Reported by: |
|
Owned by: |
|
|---|---|---|---|
| Milestone: | 4.7 | Priority: | normal |
| Severity: | normal | Version: | 4.7 |
| Component: | Bundled Theme | Keywords: | has-screenshots needs-patch |
| Focuses: | ui | Cc: |
Description
I created a post and page with some images inserted as a gallery.
It looks all fine in Firefox 49 and higher.
But this is how the page and post with the gallery does look in IE11.
(See Screenshots attached.)
The wrong, different sizing of the images in IE11 does not happen, when the images are linked to None. It only happens when the images are linked to Attachment Page and Media File.
Attachments (8)
Change History (18)
@
9 years ago
View of post with gallery in IE11, with a sidebar (made browser content smaller with Strg + -, to show more of the whole conent in relation to gallery bug)
#1
@
9 years ago
- Keywords has-screenshots added
Additional step to reproduce for me: set the gallery images size to a value other than "thumbnail".
Seems IE 11 can't calculate max-width when the element's parent is set to display: inline-block without an explicit size, which makes sense since when an inline-block element width is not set, it depends on the children. See https://www.w3.org/TR/CSS21/visudet.html#inlineblock-width
I guess other browsers check the grand parents size too.
/cc @davidakennedy
This ticket was mentioned in Slack in #core-themes by afercia. View the logs.
9 years ago
This ticket was mentioned in Slack in #core by helen. View the logs.
9 years ago
#4
@
9 years ago
- Keywords needs-patch added
- Milestone changed from Awaiting Review to 4.7
Seems like we should take a look at this since it's IE11; asking around for some help.
#5
@
9 years ago
- Owner set to derrickkoo
- Status changed from new to assigned
Assigning to @derrickkoo for investigation and hopefully a patch.
#6
@
9 years ago
@afercia is right about the cause of this problem. Giving the .gallery-item a img items an explicit width of 100%; fixes it for me in IE11 and does not have any negative effects in Chrome, Firefox, Safari, or Opera.
#7
@
9 years ago
Please use 38872.2.diff instead. This patch fixes the problem by applying the explicit width to the img's parent instead of the img itself, which allows for images to display at their natural width if they're smaller than 100%.
You can test this by setting the gallery to a single column with size set to "Medium." The images should display at their natural size, narrower than the single column.
View of a page with gallery in IE11