Register Guidelines E-Books Search Today's Posts Mark Forums Read

Go Back   MobileRead Forums > E-Book Formats > ePub

Notices

Reply
 
Thread Tools Search this Thread
Old 07-04-2011, 02:58 AM   #1
virtual_ink
Zealot
virtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheese
 
virtual_ink's Avatar
 
Posts: 107
Karma: 1000
Join Date: Sep 2010
Location: Melbourne, Australia
Device: iPad2, Kindle
Center align text in epub

I have been trying to find a fix all day but my head is about to explode. I cannot get text to center consistently throughout my epub.

In addition to the paragraph styles I wish to centre, I use a centered '*' to sub-seperate some sections of the book. Do I really need to convert these to images?

I have read these posts about related problems, but am not sure a solution is present:
http://isambard.com.au/blog/2010/08/...b-on-the-ipad/
http://www.pigsgourdsandwikis.com/20...-worse-in.html

Can anyone offer a solution?
virtual_ink is offline   Reply With Quote
Old 07-04-2011, 04:26 AM   #2
AlexBell
Wizard
AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.
 
AlexBell's Avatar
 
Posts: 2,250
Karma: 3868800
Join Date: May 2008
Location: Launceston, Tasmania
Device: Kindle3, Kobo Touch, Sony PRS T3, Nexus 7, iPad mini
For what it is worth this is what I do:

- in the stylesheet: .centre { text-indent: 0; text-align: center; }
- in the HTML: <p class="centre">*</p>

The reason for the text-indent: 0; is that I have paragraphs set to be indented, and if I don't remove the indent they won't be centred.
AlexBell is offline   Reply With Quote
 
Enthusiast
Old 07-04-2011, 07:36 AM   #3
virtual_ink
Zealot
virtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheese
 
virtual_ink's Avatar
 
Posts: 107
Karma: 1000
Join Date: Sep 2010
Location: Melbourne, Australia
Device: iPad2, Kindle
Thanks very much for your reply Alex. Have you tested the results on an iPad with the settings in iBooks for 'Full Justification' switched ON (the default setting referred to in the Pigs, Gourds and Wikis link above)?

That is what I have been testing against but it is not working. The iPad settings seem to override the css and html. I'm not sure if anyone has come up with a clever fix for this yet.
virtual_ink is offline   Reply With Quote
Old 07-04-2011, 07:40 AM   #4
mtrahan
Colonel Mustard
mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.
 
mtrahan's Avatar
 
Posts: 87
Karma: 1426
Join Date: Feb 2010
Location: Montreal
Device: iPod Touch, Kindle 3, iPad 2
I had some centering problems with iBooks also. iBooks wouldn't center paragraph but was centering header tags correctly. The solution I found after a bit of research was to add <span> and </span> tags right inside the element you want centered. To use the example above, I would in the text put <p class="centre"><span>*</span></p> instead. It worked for me at least. And yep, no indent on the centered stuff.

Good luck.

Edit: And yes, the <span> tags were added because of the full justification thingy. When I turned that off, things were centered correctly without the <span> tags, but not when turned on.

Last edited by mtrahan; 07-04-2011 at 07:42 AM. Reason: Precision
mtrahan is offline   Reply With Quote
Old 07-04-2011, 07:50 AM   #5
virtual_ink
Zealot
virtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheese
 
virtual_ink's Avatar
 
Posts: 107
Karma: 1000
Join Date: Sep 2010
Location: Melbourne, Australia
Device: iPad2, Kindle
I've just tried the above and it works!! Thank you so much mtrahan, you've well and truly made my day
virtual_ink is offline   Reply With Quote
Old 07-04-2011, 08:01 AM   #6
mtrahan
Colonel Mustard
mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.mtrahan is no ebook tyro.
 
mtrahan's Avatar
 
Posts: 87
Karma: 1426
Join Date: Feb 2010
Location: Montreal
Device: iPod Touch, Kindle 3, iPad 2
Glad to hear it did the trick
mtrahan is offline   Reply With Quote
Old 07-04-2011, 08:38 AM   #7
Jellby
frumious Bandersnatch
Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.
 
Jellby's Avatar
 
Posts: 6,054
Karma: 4571547
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Have you tried using <div class="centre"> instead of <p class="centre">?
Jellby is offline   Reply With Quote
Old 07-04-2011, 01:49 PM   #8
Zeypxi
Member
Zeypxi began at the beginning.
 
Posts: 23
Karma: 10
Join Date: Apr 2011
Device: none
Stop using ipads for reading ebooks, they're a pain in the ass.
Zeypxi is offline   Reply With Quote
Old 07-05-2011, 04:43 AM   #9
AlexBell
Wizard
AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.
 
AlexBell's Avatar
 
Posts: 2,250
Karma: 3868800
Join Date: May 2008
Location: Launceston, Tasmania
Device: Kindle3, Kobo Touch, Sony PRS T3, Nexus 7, iPad mini
Quote:
Originally Posted by virtual_ink View Post
Thanks very much for your reply Alex. Have you tested the results on an iPad with the settings in iBooks for 'Full Justification' switched ON (the default setting referred to in the Pigs, Gourds and Wikis link above)?

That is what I have been testing against but it is not working. The iPad settings seem to override the css and html. I'm not sure if anyone has come up with a clever fix for this yet.
No, I'm sorry, I don't have an iPad. I use a Sony reader.

I was under the impression that what looks good on my Sony would look good on an iPad. Is this not so?

Regards, Alex
AlexBell is offline   Reply With Quote
Old 07-05-2011, 09:13 PM   #10
virtual_ink
Zealot
virtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheese
 
virtual_ink's Avatar
 
Posts: 107
Karma: 1000
Join Date: Sep 2010
Location: Melbourne, Australia
Device: iPad2, Kindle
Quote:
Originally Posted by Jellby View Post
Have you tried using <div class="centre"> instead of <p class="centre">?
I haven't Jellby, I'll give it a shot. What are there benefits of using <div> over <p>?


@Alex, I haven't tried the Sony reader yet but iPad have a default setting for 'full justification' - which throws a lot of centered items over to the left margin (its an odd one, as some things remain centered).
virtual_ink is offline   Reply With Quote
Old 07-06-2011, 04:41 AM   #11
AlexBell
Wizard
AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.AlexBell ought to be getting tired of karma fortunes by now.
 
AlexBell's Avatar
 
Posts: 2,250
Karma: 3868800
Join Date: May 2008
Location: Launceston, Tasmania
Device: Kindle3, Kobo Touch, Sony PRS T3, Nexus 7, iPad mini
Quote:
Originally Posted by virtual_ink View Post
I haven't Jellby, I'll give it a shot. What are there benefits of using <div> over <p>?


@Alex, I haven't tried the Sony reader yet but iPad have a default setting for 'full justification' - which throws a lot of centered items over to the left margin (its an odd one, as some things remain centered).
I'll respond to both questions if I may - but I'm writing as someone who makes ePub by hand, marking up the source documents into XHTML 1.1 strict and then packaging them into an ePub.

For what is worth I only use <div class="centre"> ....</div> when I am centering several things together like

<div class="centre">
<p>Do you know who made your ebook reader?</p>
<p>Do you know whether they were paid properly and treated fairly?</p>
<p>If not, you could ask the manufacturer.</p>
<p style="margin-top: 1em;">Why it matters &hellip;&hellip;</p>
<p>http://www.guardian.co.uk/<br />
technology/2011/apr/30/<br />
apple-chinese-factory-workers-suicides-humiliation</p>

<p class="larger" style="margin-top: 3em;">Circaidy Gregory Press</p>
<p>www.circaidygregory.co.uk<br />
Independent Books for Independent Readers</p>

</div>


For the second part: I set the justification in the stylesheet - almost all the ebooks I do have the text justified. Do you know whether the iPad's setting over rules the stylesheet?
AlexBell is offline   Reply With Quote
Old 07-06-2011, 05:20 AM   #12
Jellby
frumious Bandersnatch
Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.
 
Jellby's Avatar
 
Posts: 6,054
Karma: 4571547
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Quote:
Originally Posted by virtual_ink View Post
I haven't Jellby, I'll give it a shot. What are there benefits of using <div> over <p>?
None in principle. But from what I have read, iBooks has some particular concepts about <p> et al., and maybe using <div> instead bypasses this (and it would obviate the need of "text-indent: 0" too).
Jellby is offline   Reply With Quote
Old 07-06-2011, 07:19 AM   #13
charleski
Wizard
charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.charleski ought to be getting tired of karma fortunes by now.
 
Posts: 1,188
Karma: 727236
Join Date: Sep 2009
Device: PRS-505
This is why ereaders should not try to override the code specified in the book's css. The only excuse for it is the abysmal typography found in many commercial ebooks that are produced by technicians working on minimum wage. Even then, any programmer with an ounce of sense would realise that a Full Justification override should only apply to elements set to text-align: left.

Here's a blog post about the <span> oddity in iBooks:
http://www.pigsgourdsandwikis.com/20...ooks-bugs.html
Note that it's a year old ... Apple is far more interested in adding flashy features than fixing core issues, though they have at least added support for embeddable fonts.
charleski is offline   Reply With Quote
Old 07-06-2011, 11:10 PM   #14
virtual_ink
Zealot
virtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheese
 
virtual_ink's Avatar
 
Posts: 107
Karma: 1000
Join Date: Sep 2010
Location: Melbourne, Australia
Device: iPad2, Kindle
@ Alex, yes iPad overrides the stylesheet. Crazy huh?

Aside from manually adding a blank <span> to every <p> that needs it, does anyone know a way to do this at a macro level?

Last edited by virtual_ink; 07-12-2011 at 09:44 PM.
virtual_ink is offline   Reply With Quote
Old 07-12-2011, 10:38 PM   #15
virtual_ink
Zealot
virtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheesevirtual_ink can extract oil from cheese
 
virtual_ink's Avatar
 
Posts: 107
Karma: 1000
Join Date: Sep 2010
Location: Melbourne, Australia
Device: iPad2, Kindle
Also, I can not for the life of me figure out how get his centered in iBooks.

I want to center the text 'PART I." and here's the code:

</head>
<body>
<div id="chapter-6.html" xml:lang="en-GB">
<div class="center">
<h2 id="toc_marker-3" class="sectiontitle"><strong>PART I.</strong></h2>
</div>
</div>
</body>
</html>


the css for sectiontitle is:

h2.sectiontitle {
font-family : Georgia, serif;
font-weight : bold;
font-style : normal;
font-size : 1.17em;
text-decoration : none;
font-variant : normal;
line-height : 1.2;
text-align : center;
color : #818386;
text-indent : 0px;
margin : 0px 0px 16px 0px;
}


[and the div]

div.center {
text-align : center;
}

Last edited by virtual_ink; 07-13-2011 at 12:23 AM.
virtual_ink is offline   Reply With Quote
Reply

Tags
alignment, centering, epub

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
need help on how to align a table to the right NASCARaddicted ePub 6 02-18-2011 01:46 PM
I can not align the text...help please! XD derfel_spain ePub 17 12-18-2010 09:45 AM
Can you delete div with align=center mufc Recipes 4 12-10-2010 06:23 PM
ePub files do not center a custom <hr /> tag! Haidon ePub 2 08-21-2010 04:29 AM
Text becomes center-aligned when converting Alfy Calibre 12 01-19-2009 12:41 AM


All times are GMT -4. The time now is 07:43 PM.


MobileRead.com is a privately owned, operated and funded community.