WordPress.org

Make WordPress Core

Opened 3 weeks ago

Last modified 3 weeks ago

#49138 new defect (bug)

Media Text Block CSS is-image-fill applied to all children

Reported by: launchinteractive Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version: trunk
Component: Editor Keywords:
Focuses: Cc:
PR Number:

Description

When adding an image to the content of the media and text block that has image-fill applied then it inherits the main media block styles.

To reproduce
Steps to reproduce the behavior:

Create media Text Block
Add an image
Add an image to the content of the media text block
Under Media & text settings turn on "Crop image to fill entire column"

To fix this change this:

.wp-block-media-text.is-image-fill figure {
  height: 100%;
  min-height: 250px;
  background-size: cover; }

.wp-block-media-text.is-image-fill figure > img {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0; }

to this:

.wp-block-media-text.is-image-fill > figure {
  height: 100%;
  min-height: 250px;
  background-size: cover; }

.wp-block-media-text.is-image-fill > figure > img {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0; }

in wp-includes/css/dist/block-library/style.css

Change History (1)

#1 @SergeyBiryukov
3 weeks ago

  • Component changed from General to Editor
Note: See TracTickets for help on using tickets.