Bug Description

This is a continuation of #4358 where the same problem applied to amp-facebook and was fixed.

The premise is that these amp-* objects should be in the root of the document, and not be wrapped in <p> tags. Twitter already worked this way, and in #4358 amp-facebook was fixed to match.

I've now noticed that amp-iframe, amp-instagram, amp-youtube, amp-soundcloud face the same problem:

As with the previous ticket, it's important to me because I need to style something that immediately follows the object (amp-instagram+.translation), but also generally it just seems like good practice all around.

Instagram embed code:

[embed]https://www.instagram.com/p/Buq8vU6Hcxn/[/embed]
<blockquote class="translation">This is a translation of the Instagram post above.</blockquote>

YouTube embed code

[embed]https://www.youtube.com/watch?v=vXPJVwwEmiM[/embed]
<blockquote class="translation">This is a translation of the YouTube video above.</blockquote>

Soundcloud embed code

[embed]https://soundcloud.com/globalvoices/summitpodcast[/embed]

Mostly likely this applies to other embeds as well. A general review would be greatly appreciated.

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