Make WordPress Core

Opened 5 years ago

Last modified 9 hours ago

#46785 assigned defect (bug)

Twenty Seventeen: Floated Images appear with extra space on top on the front end.

Reported by: kjellr's profile kjellr Owned by: sabernhardt's profile sabernhardt
Milestone: 6.7 Priority: normal
Severity: normal Version: 5.1
Component: Bundled Theme Keywords: has-screenshots has-patch needs-testing needs-refresh
Focuses: css Cc:

Description

Ported over from Gutenberg's repo, since this is a Twenty Seventeen issue:
https://github.com/WordPress/gutenberg/issues/14782

Steps to reproduce

  1. Create a new page, add an image block and insert image.
  2. Add a paragraph block below with text.
  3. Resize image and change to left alignment. Text wraps around image.
  4. Preview/publish

What I expected

Expected the image and text to be almost exactly aligned, as it appears in the editor.

What happened instead

When previewed/published, the first line of text has a gap above it.

Workaround: Adding an empty paragraph block above the image block removes the gap.

Browser / OS version

Chrome Version 73.0.3683.86
macOS Mojave 10.14.3


Screenshots

Page creation:
https://cldup.com/whURZYOf-k.gif

Before adding empty paragraph block:
https://cldup.com/QiGnsXicGs-1200x1200.png

Empty paragraph block applied in editor:
https://cldup.com/QOrcLW8iWM-3000x3000.png

After adding empty paragraph block:
https://cldup.com/AgAjLakQ6b-3000x3000.png

Attachments (1)

46785.patch (681 bytes) - added by sabernhardt 3 years ago.

Download all attachments as: .zip

Change History (10)

@sabernhardt
3 years ago

#1 @sabernhardt
3 years ago

  • Focuses css added
  • Keywords has-patch needs-testing added

The gap seems to occur only when the aligned image is the first block, so I used :first-child in the patch. This patch also removes the 0.5em top margin from these blocks (overriding 'block-library' styles).

#2 @karmatosed
7 weeks ago

  • Milestone changed from Awaiting Review to Future Release

#3 @karmatosed
6 weeks ago

  • Milestone changed from Future Release to 6.6

I think this is a candidate for the next release if we get testing in.

#4 @hmbashar
6 weeks ago

Test Report

Description

I applied the patch, but nothing changed.

Patch tested:46785.patch

Environment

  • WordPress: 6.6-alpha-57778-src
  • PHP: 8.3.7
  • Server: nginx/1.25.4
  • Database: mysqli (Server: 8.3.0 / Client: mysqlnd 8.3.7)
  • Browser: Chrome 125.0.0.0
  • OS: macOS
  • Theme: Twenty Seventeen 3.6
  • MU Plugins: None activated
  • Plugins:
    • FakerPress 0.6.6
    • Test Reports 1.1.0

Actual Results

  1. I applied the patch, but nothing changed.

Screenshots

https://i.ibb.co/d0f63n6/before-apply-patch.png

https://i.ibb.co/fQ24Z6b/After-Patch.png

Last edited 6 weeks ago by hmbashar (previous) (diff)

#5 @karmatosed
6 weeks ago

  • Milestone changed from 6.6 to Future Release

This looks like it needs to go back into future release for more testing, thank you everyone.

#6 @karmatosed
4 weeks ago

  • Keywords needs-refresh added

#7 @karmatosed
7 days ago

  • Milestone changed from Future Release to 6.7

@sabernhardt it looks like this patch is failing right now. I am happy to have other instructions if this is something I am doing wrong. I can absolutely see the issue though and suspect a refreshed patch will solve this from you.

As I think if it has a patch refresh this would be a good candidate for the next release, going to put that on.

#8 @karmatosed
3 days ago

  • Owner set to sabernhardt
  • Status changed from new to assigned

This ticket was mentioned in Slack in #core-themes by karmatosed. View the logs.


9 hours ago

Note: See TracTickets for help on using tickets.