techfoobar
techfoobar

Reputation: 66693

How to get an iframe to occupy full width (i.e. display like a div)

I'm trying to get an iframe to behave like a normal non-floating DIV does. i.e. occupy full width of parent. Is this possible? Looking for something equivalent to saying display: div;

Edit: I'm not looking for width: 100% since i have another floating element to the left. A non-floating DIV would take the rest of the space on the right. This is the behavior i'm looking to achieve.

Working: With a DIV on the right - http://jsbin.com/onaxax/1/edit

Not Working: With an IFRAME on the right - http://jsbin.com/erapuv/1/edit

Upvotes: 16

Views: 40067

Answers (1)

Litek
Litek

Reputation: 4888

You have to wrap your iframe in element with overflow:hidden that would occupy the remaining space, and than set the iframe's width to 100%.

Example.

Upvotes: 19

Related Questions