AMP page for image attachment has wrong alignment for image

[pierlon]

Bug Description

The AMP page for an image attachment displays the image as centered, while the image non-AMP counterpart is left-aligned.

Expected Behaviour

AMP and non-AMP page for an image attachment should have the same alignment.

Steps to reproduce

1. View the page for an image attachment.
2. Compare the non-AMP and AMP version of the page

Screenshots

Additional context

• WordPress version:
• Plugin version:
• Gutenberg plugin version (if applicable):
• AMP plugin template mode:
• PHP version:
• OS:
• Browser: [e.g. chrome, safari]
• Device: [e.g. iPhone6]

---

Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance criteria

Implementation brief

QA testing instructions

Demo

Changelog entry

[westonruter]

Somehow this issue is caused by this rule:

amp-img:not([_]) {
    display: block;
}

This was added in #4421 to fix #4419:

amp-wp/includes/sanitizers/class-amp-core-theme-sanitizer.php

Lines 778 to 803 in 2bfb9bb

	/**
	* Add style rule with a selector of higher specificity than just `img` to make `amp-img` have `display:block` rather than `display:inline-block`.
	*
	* This is needed to override the AMP core stylesheet which has a more specific selector `.i-amphtml-layout-intrinsic` which
	* is given a `display: inline-block`; this display value prevents margins from collapsing with surrounding block elements,
	* resulting in larger margins in AMP than expected.
	*
	* @since 1.5
	* @link https://github.com/ampproject/amp-wp/issues/4419
	*/
	public static function add_img_display_block_fix() {
	$method = __METHOD__;
	// Note that wp_add_inline_style() is not used because this stylesheet needs to be added _before_ style.css so
	// that any subsequent style rules for images will continue to override.
	add_action(
	'wp_print_styles',
	static function() use ( $method ) {
	printf(
	'<style data-src="%s">%s</style>',
	esc_attr( $method ),
	// The selector is targeting an attribute that can never appear. It is purely present to increase specificity.
	'amp-img:not([_]) { display: block }'
	);
	}
	);
	}