Question

I am styling a WordPress theme but has run into problem with IE7.

The first word(“it”) inside the paragraph/strong tag ends up to the left of the img tag when I want it BELOW the image.

My problem is that the only element I can change CSS properties here is the div, since the code inside is posted with a WYSIWYG by an blog author.

Is there anyway i can fix this problem?
I have tried lots of different settings and every other browser FF safari IE8 renders the text below the image.

<div style="width: 430px;">
    <h1>It is hard getting it right in IE7!</h1> 
    <p>
        <img class="aligncenter size-full wp-image-4333"  src="http://xxx.xxx.xx/files/2010/03/xxx.jpg" alt="xxx" style="width: 430px; height: 600px" />
        <strong>It is hard</strong> getting it right in IE7!
    </p>
</div>

data.fuskbugg.se/skalman01/Ie7.png
The important is in the element style but heres the rest.

strong { line-height: 16px; } 
p { 5px 0px 10px; } 
h1 { 
  font-family:"arial black","lucida console",sans-serif; font-size:30px;
  font-weight:normal; 
  line-height:31px; 
  margin:0; 
  padding:0 0 10px; 
}

Answer 1

img.size-full {display:block;}

This will (should) create a line break after the image.