Style Instagram embeds with CSS.
Set width, alignment, border and shadow, watch the preview, and copy CSS that overrides the inline styles Instagram adds to its embeds.
Quick answer: Instagram embeds carry inline styles, so ordinary CSS is ignored. This generator outputs rules with !important for .instagram-media that set width, alignment, border and shadow. Paste them into Appearance, Customize, Additional CSS.
Frequently asked questions
Why do I need !important?
Instagram's embed script adds inline width, margin and border styles to each embed. Only !important rules in your CSS can override inline styles.
Where do I paste the CSS?
In WordPress go to Appearance, Customize, Additional CSS, or add it to your theme stylesheet.
Does it work with the InstaBlocks plugin?
InstaBlocks has its own width, border and shadow controls and style presets in the block sidebar, so you do not need custom CSS there. This tool is for embeds made with plain embed code.
What is the largest an Instagram embed can be?
Instagram renders embeds up to about 540px wide and not below about 326px. The CSS keeps the 540px ceiling.
Get the free browser extension
InstaBlocks Embed Helper for Chrome, Edge and Opera.