Div/Photo Problem on Archive Page

  • I am having a div problem on my archive page when the text does not go below the photo in the post. Please look at these 2 screenshots (link below). The gray background should continue to the meta data below. Instead white appears. You can see that when the text goes below the image the div works fine. Thanks for any help you might give.

    https://wigginsdesign.wordpress.com/2008/12/31/div-problem/

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi Mwiggins,

    Looking at it quickly i’d assume it’s a “clearing” problem associated with your floated image.

    In the div that has the background colour, after the floated image and body text put:

    <div style=”clear: both”> </div>

    This is a common issue so many developers will create a “clear” class with that same attribute, and a little more (such as “font-size:1px”), so you can just do:

    <div class=”clear”> </div>

    The reason you need this is because floats will float outside of their containers. Adding a div that “clears” the content will make sure that the containing div wraps all your content – floated or not.

    https://www.w3schools.com/Css/pr_class_clear.asp

    Thread Starter mwiggins

    (@mwiggins)

    Ahhhhh, forums are the best thing on the planet. Thanks so much.

    No probs. Remember to make the topic as resolved

    Roy

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Div/Photo Problem on Archive Page’ is closed to new replies.

Tags