Inline Absolute Overflow Test

Modern browsers will allow absolutely positioned elements to be positioned relative to an inline (or inline-block) element that contains it. If available, this allows the sizing of an iframe based on the width of some text inside a div. If not, the absolutely positioned element's width will be based on the next highest relatively positioned parent (or the page). Without this feature, the only known automatic way to associate the size of text with the width of an element is to use a table.

There are numerous browser versions and modes, particularly in the case of legacy Internet Explorer versions. The same test is provided for the most common doctypes. Each one can be tested against not only different browser versions, but also different display modes within that browser. For legacy Internet Explorer versions, the pages should be tested in Standards View and Compatibility View. There are far more modes and versions that it is feasible to test, so below are some tests that conform to common scenarios. For exhaustive data on this subject, read Activating Browser Modes with Doctype. Additional doctypes were obtained from Webstandards.org's Templates.

Modes

Tested Browsers

Chrome (50.0.2661.86)
Chrome iOS (49.0.2623.109)
Firefox (26.0)
Opera (36.0.2130.46)
Safari (Version 9.0 - 11601.1.56)
Safari iOS (Version 9.0 Mobile - 13E238)
Microsoft Edge (20.10240.16384.0)
Internet Explorer 11 (Standards View)
Internet Explorer 11 (Compatibility View)
Internet Explorer 10 (Standards View)
Internet Explorer 10 (Compatibility View)
Internet Explorer 9 (Standards View)
Internet Explorer 9 (Compatibility View)
Internet Explorer 8 (Standards View)
Internet Explorer 8 (Compatibility View)
Internet Explorer 7
Internet Explorer 6