Text Overlapping Image in Nook for PC, Help

[dvrader]

I'm designing an ebook for a client, and I'm having a problem with the text overlapping the image when the epub is loaded into the Nook for PC. It works on the Nook Color, Touch, and Mac version.

The client is adamant that he wants this to work in the PC viewer. Please help.

Code and screenshot are below.

<h3 id="sigil_toc_id_33" style="text-align: center;">The SAT – Your Gateway to Heaven or Hell</h3>

<p style="text-align: center;"><img alt="" src="../Images/SAT_464x600.jpg" /><br /></p>

<p style="text-align: justify;">It’s impossible to overstate how important your SAT results are to your Indian parents. Sure, your grades are important, but they pale in comparison to the singular importance of the SAT. Think of your SAT score as a medical test result that tells your parents whether <em>they</em> are going to live or die. Knowing this helps you understand why your parents will be stressed as shit during the few years leading up to your taking the SAT.</p>

h3 {
font-family: sans-serif;
text-align: center;
line-height: 1em;
margin-top: 2em;
}

p {
font-family: serif;
font-height: 1.17em;
line-height: 1.60em;
text-indent:1.5em !important;
margin: 0em 0em 1em 0em;
}

[theducks]

you have not controlled the image size (scaled) from the original (if I guessed right) 464x600.

text-align is not always a perfect way to center images

[mrmikel]

It might need to be shrunk about 20 pixels to avoid spillover. No need for that break in the image paragraph either.

[DiapDealer]

What's "font-height"?

[theducks]

Originally Posted by DiapDealer

What's "font-height"?

Missed that one.
ADE would probably choke on that one alone