View Single Post
Old 05-23-2014, 10:25 AM   #1
ljcblue
Junior Member
ljcblue began at the beginning.
 
Posts: 3
Karma: 10
Join Date: Mar 2009
Device: Kindle 1
Strange, specific bug rendering centered text w/ p class command in Nook touch

My apologies if this is something already discussed, but I searched the forums for some time without finding the issue.

I create my epubs by hand in sigil from html.

I have a dead simple stylesheet (pasted below).

I've run into a strange problem that I've only seen on the Nook Simple Touch, in which when I use <p class="p-center"> for a centered element, when using SOME combinations of font size and margins, part of the final word is just cut off on the device, not rolled over to another line or page.

It renders fine on my computer in ADE. No issues in iBooks. The EPUB validates.

I've had to add a designation for centered text in my CSS: center { display: block; text-align: center; margin: 0;
padding: 0; text-indent: 0
}

And enclose the desired text in <center> </center>, rather than use a <p class> command in order for it to render properly at all font sizes and margin settings on the nook.

Any ideas why?? My other <p class> commands work.


This is my stylesheet:

/* This defines styles and classes used in the book */


p { text-indent: 1.7em; text-align: justify; margin-bottom: 0; margin-top: 0; padding-bottom: 0; padding-top: 0;
}

/*the nook simple touch doesn't like the p class for centering for some reason. This works. */

center { display: block; text-align: center; margin: 0;
padding: 0; text-indent: 0
}

/* These next 2 styles are to ensure centered chapter headings. */
.chapterheading { display: block; text-align: center; margin-top: 5em; margin-bottom: 3em;
margin-left: 0;
margin-right: 0;
text-indent: 0
}

.h1 { font-size: 1.2em; font-weight: bold }


.p-first { text-indent: 0; text-align: justify; margin: 0; padding: 0;
}

/*the nook simple touch does NOT like this next setting and will give unpredictible results if used to set centered text */

.p-center { display: block; text-align: center; margin: 0;
padding: 0; text-indent: 0
}


.p-scenebreak { width: 100%; text-indent: 0; text-align: center; font-size: 1.5em;
margin-top: 1em; margin-bottom: 1em;
padding: 0;
}

Last edited by ljcblue; 05-23-2014 at 12:44 PM. Reason: typo in the post picked up by Ruben. Thank you!
ljcblue is offline   Reply With Quote