WordPress.org

Make WordPress Core

Opened 15 months ago

Last modified 3 weeks ago

#45876 new defect (bug)

Twenty Nineteen: Dropcap appears higher than expected in Firefox

Reported by: kjellr Owned by:
Milestone: 5.5 Priority: normal
Severity: normal Version: 5.0
Component: Bundled Theme Keywords: has-screenshots has-patch
Focuses: css Cc:

Description

As noted by @josephdickson, Firefox renders the dropcap text roughly 0.2em higher than in Chromium:

https://cldup.com/yGg0iA2a7b.thumb.jpg

@josephdickson proposed a possible solution:

With a little help from @electmikemann ( via Twitter) I found a solution that I'd like to propose for a future update.

https://cldup.com/gmQzbBPGcP-3000x3000.png

The @-moz prefix targets Firefox and is ignored by other browsers. I've tested it via the Customizer's Additional CSS box. Anyone can do the same for a quick fix.

@-moz-document url-prefix() {
	.entry .entry-content .has-drop-cap:not(:focus)::first-letter {
  	margin-top: 0.2em;
	}
}

---

This issue was migrated over from Twenty Nineteen's GitHub repository:

https://github.com/WordPress/twentynineteen/issues/749

Attachments (2)

45876.1.diff (35.7 KB) - added by maxpertici 3 weeks ago.
Diff fix with hack @ -moz-document url-prefix ()
45876.2.diff (35.4 KB) - added by maxpertici 3 weeks ago.
Same patch without package.json modification

Download all attachments as: .zip

Change History (9)

#1 @joseph.dickson
15 months ago

@kjellr Thanks for migrating this request.

#2 @laurelfulford
14 months ago

  • Keywords has-screenshots added; needs-testing removed
  • Milestone changed from Awaiting Review to Future Release

#3 @ianbelanger
5 weeks ago

  • Focuses css added
  • Milestone changed from Future Release to 5.5
  • Version changed from 5.0.2 to 5.0

@maxpertici
3 weeks ago

Diff fix with hack @ -moz-document url-prefix ()

#4 @maxpertici
3 weeks ago

I propose this patch on the basis of the hack proposed on this ticket. This refers to the scss style-editor and _blocks files and the generated css files.

#5 @ianbelanger
3 weeks ago

  • Keywords has-patch needs-refresh added; needs-patch removed

Hi @maxpertici,

Thanks for your patch. It does seem to fix the issue in Firefox, but I noticed that there is a change to the package.json file in your diff. Please remove this change and resubmit the patch.

@maxpertici
3 weeks ago

Same patch without package.json modification

#6 @maxpertici
3 weeks ago

Hi @ianbelanger,

I hope this one will be better.
Sorry for the setback. Obviously a change on the grunt config.

#7 @ianbelanger
3 weeks ago

  • Keywords needs-refresh removed

No problem, thanks for updating your patch.

Note: See TracTickets for help on using tickets.