Search code examples
htmlcssiframealignment

Iframe align with parent <p>

My site is devided in 4 sections, every section has a h3 and a <p>. All content in the <p> is centered with margin-left: auto; margin-right: auto; it also has a background-color and border. The <p> also grows automatic with its content.

In the one of the <p> is an iframe which is also centered, but i need it aligned to the left. The iframe is smaller than the width of the <p>.

float: left works, but the iframe gets closed out of the <p>. So my <p> is just on line and the iframe floats out of it.

Any idea why this happens?

http://jsfiddle.net/dennym/KBShz/

Solution

  • Try adding:

    #another p { overflow: hidden; }

    Updated fiddle: http://jsfiddle.net/KBShz/13/