css - 在 Chrome 和 Safari 中 img 后奇怪的中断，但在 Firefox 中正常

Question

Live site.

在测试我正在使用的网站后，我发现了一个只在 Chrome 和 Safari 中发生的奇怪中断。在 Firefox 中一切看起来都很好。

欢迎来到 BodywoRx

    <div class="banner-image">
        <img src="<?php echo get_template_directory_uri(); ?>/img/large.jpg" alt="about-place-holder" id="aph" />
    </div><!-- end banner-image -->
    <p>Body WoRx was founded on the belief that many dysfunctions of the body can be healed through massage therapy.  In a world where prescriptions are written for variety of symptoms, we offer an alternative solution to helping the body heal itself.  We are located in historic downtown Grand Prairie, conveniently centered between Fort Worth and Dallas.</p>
    <div class="bio">
        <img src="<?php echo get_template_directory_uri(); ?>/img/bridgett.jpg" alt="bridgett-freiburger" id="bf" />
        <p>Bridgett suffered from chronic neck, back, and shoulder pain for many years.  She went to many doctors, specialists, had many MRI&apos;s, but no one knew what was causing the pain.  She had been prescribed countless medications to help ease discomfort, but nothing to address the cause.  Bridgett stumbled across massage therapy and has since become a firm believer and advocate in its many benefits and healing properties.  Before getting into massage therapy, Bridgett served in the Marine Corps, and then continued supporting the war fighter while working at Bell Helicopter. Bridgett is a graduate of North Texas School of Swedish Massage.</p>
    </div><!-- end bio -->
</div><!-- end about -->

我敢肯定这是小事，我只是不太明白。有任何想法吗？谢谢。

Answer 1

尝试在第二张图片上使用float。

.bio img {
    float: left;
}

JS fiddle :http://jsfiddle.net/J4MK4/2/