![(please configure the [header_logo] section in trac.ini)](/chrome/site/your_project_logo.png){kind=logo}
#53681 closed defect (bug) (fixed)
Twenty Nineteen: reduce bottom margin for Audio block
| Reported by: | PGeorgiev | Owned by: | karmatosed |
|---|---|---|---|
| Priority: | normal | Milestone: | 6.7 |
| Component: | Bundled Theme | Version: | |
| Severity: | normal | Keywords: | has-patch needs-refresh commit |
| Cc: | Focuses: |
Description
Audio in Twenty Nineteen are lacking a bottom margin
Posts that have audio: Cover block with background image is too close to the media.
Attached is a screenshot from Mozilla Firefox
Attachments (14)
Change History (33)
#1
@
5 years ago
- Summary Audio in Twenty Nineteen are lacking bottom margin → Twenty Nineteen: Audio are lacking bottom margin
This ticket was mentioned in Slack in #core by jeffpaul. View the logs.
5 years ago
#3
follow-up:
↓ 4
@
5 years ago
- Keywords reporter-feedback added
- Version trunk
Hi @PGeorgiev,
Thanks for this ticket! I'm having a little bit of trouble understanding the issue as reported.
I've attached what I am seeing when using Twenty Nineteen and inserting an audio block followed by a cover block. There appears to be a proper margin between the two inherited from the .entry .entry-content > * CSS rule.
Is the suggestion that there should be less of a margin after an audio block? Based on the patch applying a -24px margin, I think that's the case. But I'm not sure that's right because every block has a margin-bottom of 32px.
#4
in reply to: ↑ 3
@
5 years ago
Replying to desrosj:
Hi @PGeorgiev,
Thanks for this ticket! I'm having a little bit of trouble understanding the issue as reported.
I've attached what I am seeing when using Twenty Nineteen and inserting an audio block followed by a cover block. There appears to be a proper margin between the two inherited from the
.entry .entry-content > *CSS rule.
Is the suggestion that there should be less of a margin after an audio block? Based on the patch applying a
-24pxmargin, I think that's the case. But I'm not sure that's right because every block has amargin-bottomof32px.
Thanks for your reply,
It's just that the space between the two blocks seemed really big to me and that's why I'm proposing to reduce it.
Sorry, this is my first ticket (maybe a second) and if you don't think it makes sense, you can close it of course.
Appreciate it!
#5
@
5 years ago
- Focuses ui removed
- Keywords needs-testing needs-patch added; has-patch reporter-feedback removed
Thanks for clarifying! I understand now.
I think that the margin is correct. I took a second look, and the space is definitely larger than between other blocks. It seems there is a height or line-height somewhere for the <figure> or <audio> tags resulting in white space.
I think the right way forward is to figure that out rather than adjusting the margin.
#6
@
5 years ago
Hey @desrosj,
I apologize a lot for the delay here. I added a style that only applies to figure.wp-block-audio in this case will only apply to this block and we will not affect the styles of the others
I would be happy to share your feedback as this is my first ticket
This ticket was mentioned in PR #6575 on WordPress/wordpress-develop by @sabernhardt.
2 years ago
#9
Sets audio element to display: block in the Audio block, for both the front end and the editor.
#10
@
2 years ago
- Keywords needs-testing added
- Summary Twenty Nineteen: Audio are lacking bottom margin → Twenty Nineteen: reduce bottom margin for Audio block
#11
@
2 years ago
- Milestone Future Release → 6.6
Moving to this release for consideration and testing.
#12
@
2 years ago
- Milestone 6.6 → Future Release
Putting back into future release as seems to need testing to see if still an issue or not.
#14
@
2 years ago
@sabernhardt unless I am mistaken the patch on this doesn't have any changes to the display without patch. Are you able to have a little check to see?
#16
@
23 months ago
The screenshots are taken with Firefox/Windows, and I also saw a difference with the patch in Chrome/Windows. Maybe another browser/OS sets the audio element to block by default.
Side note: the caption styling is different in the iframe because the figcaption ruleset in style-editor does not have the .editor-styles-wrapper class, and now .wp-block-audio :where(figcaption) in block-library/theme.css has a higher specificity. On the front, the font size comes from style.css and the color from block-library/theme.css.
#17
@
23 months ago
- Keywords commit added
- Milestone Future Release → 6.7
Based on the above, I am going to move this to commit as have also found similar in testing after the steps were shown.
@sabernhardt commented on PR #6575:
22 months ago
#19
Committed in r58959
Twenty Nineteen audi file without margin