`Why HTML5 Iframe Width Isn't The Best Option To Control Sizing`

In HTML Attributes

Disclosure: Your support helps keep the site running! We earn a referral fee for some of the services we recommend on this page. Learn more

Attribute of: Using The HTML Tag To Create Inline Frames: Here's How
What does Why HTML5 Iframe Width Isn't The Best Option To Control Sizing do?: Specifies the width of an iframe.

Code Example

<iframe width="100%" height="500" src="https://html.com"></iframe>

Valid, but maybe don’t use

Most of the styling attributes associated with <iframe> (and most other elements as well) have been deprecated in HTML5. However, width and [height] persist. So their use in specifying the size of an <iframe> is perfectly valid, but its a little hard to understand what the thinking was on this. Regardless of validity, the best design practice — especially from a responsive perspective — is to use CSS to control the sizing. This removes presentational information from your markup and allows you to more easily design for a wide range of browser sizes.

iframe.example {  width: 100%;  height: 600px; }

<iframe class="example" src="/html5"></iframe>

iframe.example { width: 100%; height: 600px; }

Adam Wood

Adam is a technical writer who specializes in developer documentation and tutorials.

Browser Support for width


All	All	All	All	All	All