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 06-15-2011, 04:34 PM   #1
iain robinson
Connoisseur
iain robinson began at the beginning.
 
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
problem with bullet at end of paragraph

Hi all

We're attempting to match a print job in ePub. Obviously matching it exactly is not possible but I'm trying to carry as many design features as possible over to the ePub and one of them is at the end of the last paragraph there's a coloured bullet. No matter what I do I can't get the bullet to work in ePub - I can get it to appear, styled with a span, but I can't get it to sit on the line with the 'normal' text and not cause a gap in the paragraph (in ADE). See screenshots attached

The bullet in the attached ADE screenshot is styled as;

Code:
span.end-bullet {
color: #C9652F;
position: relative; 
bottom: -0.2em;
font-size: 2em;
line-height: 0.9em;
}
which is a combination of lifting code from here and there. It looks better in Sigil - it's on the line but still causes a gap in the paragraph. There's got to be a better way that works in both...?
Attached Thumbnails
Click image for larger version

Name:	desired effect.png
Views:	149
Size:	34.2 KB
ID:	72828   Click image for larger version

Name:	result in ADE.png
Views:	160
Size:	66.2 KB
ID:	72829  
iain robinson is offline   Reply With Quote
Advert
Old 06-16-2011, 05:07 AM   #2
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: 7,072
Karma: 9567891
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Quote:
Originally Posted by iain robinson View Post
font-size: 2em;
line-height: 0.9em;
Those together mean that the line height for the bullet is 1.8em in the normal text size, and then you get the gaps. Have you tried "line-height: 0"? (I'd also remove position and bottom).
Jellby is offline   Reply With Quote
Old 06-16-2011, 05:31 AM   #3
iain robinson
Connoisseur
iain robinson began at the beginning.
 
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
Thanks. Now we're getting somewhere - that change to the CSS means I don't have the paragraph gap any more but the bullet is sitting too high relative to the text (see screenshot attached).

To drop that onto the baseline with the normal text I added

Code:
vertical-align:middle;
That makes it look okay in ADE (but maybe a little low). Doesn't look quite right in Sigil (so maybe iBooks too, but can't test it at the moment). is there another/better way to align the bullet?
Attached Thumbnails
Click image for larger version

Name:	getting there.png
Views:	149
Size:	43.8 KB
ID:	72849  
iain robinson is offline   Reply With Quote
Old 06-16-2011, 07:53 AM   #4
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: 7,072
Karma: 9567891
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
I don't think there is a bullet-proof (oops, no pun intended) solution, because the size and position of the bullet is font-dependent. But you could include the bullet either as an image (even an SVG image) or as an embedded font, that way you can control the exact position with respect to the baseline...
Jellby is offline   Reply With Quote
Old 06-16-2011, 08:08 AM   #5
iain robinson
Connoisseur
iain robinson began at the beginning.
 
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
Okay, thanks. I'll test it on some devices. Did consider using an image for my bullets in unordered lists but didn't want to have to unzip the ePub to add it in and then have to rezip it. Currently we're doing all our tweaking in Sigil and then just resaving it.
iain robinson is offline   Reply With Quote
Advert
Old 06-16-2011, 11:59 AM   #6
DiapDealer
Grand Sorcerer
DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.
 
DiapDealer's Avatar
 
Posts: 17,051
Karma: 89654632
Join Date: Jan 2010
Device: Nexus 7, Kindle Fire HD
Quote:
Did consider using an image for my bullets in unordered lists but didn't want to have to unzip the ePub to add it in and then have to rezip it. Currently we're doing all our tweaking in Sigil and then just resaving it.
?? You can add an image to an epub directly from Sigil without unzipping and rezipping manually.
DiapDealer is offline   Reply With Quote
Old 06-16-2011, 12:03 PM   #7
iain robinson
Connoisseur
iain robinson began at the beginning.
 
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
Wow - I didn't know that. I was sure I'd tried... Thanks! Does it do all "the paperwork" behind the scenes (ie, add the filename(s) anywhere it needs to be mentioned within the ePub so it validates?
iain robinson is offline   Reply With Quote
Old 06-16-2011, 12:25 PM   #8
DiapDealer
Grand Sorcerer
DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.
 
DiapDealer's Avatar
 
Posts: 17,051
Karma: 89654632
Join Date: Jan 2010
Device: Nexus 7, Kindle Fire HD
Yes, Sigil does whatever is necessary for the image to be a part of the epub package (right click on the "Images" folder and select "Add Existing Items"). You will still need to add the xhtml for the image to actually appear where you want it to in the ebook, though.
DiapDealer is offline   Reply With Quote
Old 06-17-2011, 02:56 AM   #9
iain robinson
Connoisseur
iain robinson began at the beginning.
 
Posts: 75
Karma: 10
Join Date: Apr 2011
Location: UK
Device: none
That's great - it opens up the possibility of using images for bullets. Cheers!
iain robinson is offline   Reply With Quote
Reply

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Problem with non-indented paragraph Soxendom ePub 2 05-16-2011 06:30 AM
I'm having a problem with extra paragraph spaces akosimike Calibre 10 05-27-2010 06:53 PM
Stop line wrapping at quotes at the end of a paragraph sherman ePub 6 05-13-2010 02:52 PM
LRF paragraph problem qq67 Calibre 4 03-09-2010 06:40 AM
EPUB: End of paragraph after letters with accent? wildbilly Calibre 3 01-29-2010 09:15 AM


All times are GMT -4. The time now is 09:39 PM.


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