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 11-25-2013, 08:14 AM   #16
Psymon
Chief Bohemian Misfit
Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.
 
Psymon's Avatar
 
Posts: 394
Karma: 30686
Join Date: May 2013
Device: iPad, ADE
Quote:
Originally Posted by AlexBell View Post
I'm sorry, I'm probably going to expose my ignorance or lack of sophistication here, but I don't understand your question. I have uploaded several ebooks in which I took an image to use as the cover, and then overwrote the book title on that image.
Well, it's just my concern that others have mentioned that using background-image isn't really a valid epub way of doing things -- but it's all over my head, so I can't actually give you more details than that.

I do seem to recall that in one of the threads I looked at the other day (while trying to find how to do this, before posting my question) had one person coming up with a possible solution, and another person replying by saying that what they'd done should be put in an SVG wrapper -- but if I remember correctly, that's where that thread ended and there was no explanation or expansion on that (I don't have a link for that thread, off-hand, but could probably find it again -- although as I said it didn't go into the reason "why" it should be in an SVG wrapper, let alone did that person explain how).

Gotta run -- busy day today! And thanks again to Rubén for all your great input here!
Psymon is offline   Reply With Quote
Old 11-25-2013, 01:02 PM   #17
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,312
Karma: 4963983
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Quote:
Originally Posted by Psymon View Post
Well, it's just my concern that others have mentioned that using background-image isn't really a valid epub way of doing things -- but it's all over my head, so I can't actually give you more details than that.
Due to the way CSS works, using background-image does not mean the ePub will be invalid. It is still a perfectly valid and compliant ePub 2 file (as long as there's nothing else breaking it). It just means that just-as-compliant readers are free to ignore the background image and not display it. If that happens, you cannot blame the reader. Whether or not this possibility is enough to worry you, that depends on the nature of the background image and your nitpicking level
Jellby is offline   Reply With Quote
Old 11-25-2013, 03:48 PM   #18
SBT
Fanatic
SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.SBT ought to be getting tired of karma fortunes by now.
 
SBT's Avatar
 
Posts: 531
Karma: 594538
Join Date: Sep 2010
Location: Norway
Device: prs-t1, tablet, Nook Simple, assorted kindles
I'm a great fan of SVG, but in this case, may it not work with a negative bottom margin? Something like:
Code:
<img src="prettypicture.jpg" style="width:100%;margin-bottom:-80%;" />
<h2 style="page-break-after:always;">Pretty pictures</h2>
(It is possible to have text immediately after the image, but then things get a bit iffy)
Or have somebody already suggested this? I had a little bit of trouble finding every one of the helpful links so far suggested in this thread.
SBT is offline   Reply With Quote
Old 11-25-2013, 04:29 PM   #19
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,312
Karma: 4963983
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Quote:
Originally Posted by SBT View Post
I'm a great fan of SVG, but in this case, may it not work with a negative bottom margin?
Note that percentages in margins are to be referred to the width of the element, regardless of whether the margin is vertical or horizontal.
Jellby is offline   Reply With Quote
Old 11-25-2013, 04:44 PM   #20
RbnJrg
Evangelist
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 483
Karma: 318996
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by SBT View Post
I'm a great fan of SVG, but in this case, may it not work with a negative bottom margin? Something like:
Code:
<img src="prettypicture.jpg" style="width:100%;margin-bottom:-80%;" />
<h2 style="page-break-after:always;">Pretty pictures</h2>
(It is possible to have text immediately after the image, but then things get a bit iffy)
Or have somebody already suggested this? I had a little bit of trouble finding every one of the helpful links so far suggested in this thread.
Did you see the following threads?

http://www.mobileread.com/forums/sho...d.php?t=223178

and

http://www.mobileread.com/forums/sho...d.php?t=226285
RbnJrg is offline   Reply With Quote
Old 11-26-2013, 02:20 AM   #21
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,336
Karma: 3943904
Join Date: May 2008
Location: Launceston, Tasmania
Device: Kindle3, Kobo Touch, Sony PRS T3, Nexus 7, iPad mini
Quote:
Originally Posted by RbnJrg View Post
Hi Alex;

As for the book you mention, I was watching it and I didn't find a cover with a background image and text on top, maybe you did that in another book and not in the one you mention.

Attachment 115733

But anyway, it is perfectly possible to use a background image and write text on it. That is what I did in:

http://www.mobileread.com/forums/sho...87&postcount=5

By the way, very very nice layout of the book you posted; I really like it a lot. You have made a great work with it; congratulations.

Regards
Rubén
Thanks, Rubén

I didn't explain myself clearly - I meant that the image with superimposed text does the same job as a background image with text - although of course the text can't be made bigger or smaller.

You have excellent taste in ebooks.
AlexBell is offline   Reply With Quote
Old 11-26-2013, 11:58 AM   #22
Psymon
Chief Bohemian Misfit
Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.
 
Psymon's Avatar
 
Posts: 394
Karma: 30686
Join Date: May 2013
Device: iPad, ADE
Well, I'm frustrated -- again. I spent hours last night doing up all 20+ chapter title pages in that SVG method you posted, Rubén, and although they all look great now, I'm such a dummy that it was only after I'd spent all that time fixing up every chapter title so that it would look nice -- which is a total pain to do when you have to adjust everything with pixels rather than just specifying a heading or paragraph or whatever -- that it hit me that in the process I'd invariably lost all my <h1> tags (duh!) and hence none of the chapters were getting marked to the table of contents either.

If only for this latter reason (re the ToC) and, indeed, for the MUCH greater ease of editing, I thought I'd go try out your background-image method instead, and see what happens, i.e....

Quote:
Originally Posted by RbnJrg View Post
By the way, did you see this post:

http://www.mobileread.com/forums/sho...87&postcount=5

That solution also works in ADE.
I couldn't get this to work for me -- at least, not with that background image that I've been using. I'm assuming that I'm doing something wrong, but I don't know what. That background image is 1200x1800, but I adjusted the code you gave at the above link to give the image a height of 900.

In Sigil it looks fine -- and I haven't looked yet, but I'm guessing it probably would look fine in iBooks -- but in ADE it doesn't work at all. The image comes out HUGE (i.e. full-size), not constrained to the 900px height, let alone is it "contained". And my title text seems to get lost off to the side somewhere, "invisible".

Any suggestions? What I had hoped to do isn't quite what you had done at the above link -- you basically had a lo-res image that sat at the top left corner of the page (or that's how it "looks", of course), but I wanted a full-page image, and then plop my chapter title text on that.

If it's just not really doable or practical, well, I'll just scrap the idea -- but even if it works in some readers and then for others just shows the text but no background image at all (without "breaking" anything), I could live with that.

Psymon is offline   Reply With Quote
Old 11-26-2013, 12:35 PM   #23
mrmikel
Color me gone
mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.mrmikel ought to be getting tired of karma fortunes by now.
 
Posts: 2,086
Karma: 1444487
Join Date: Apr 2008
Location: Central Oregon Coast
Device: PRS-300
>>If it's just not really doable or practical, well, I'll just scrap the idea -- but >>even if it works in some readers and then for others just shows the text but no >>background image at all (without "breaking" anything), I could live with that.

The only problem with that is which ones it breaks on, unless this is not a commercial job, just for your own use. It can be hard to test for all of them.
mrmikel is offline   Reply With Quote
Old 11-26-2013, 03:10 PM   #24
Psymon
Chief Bohemian Misfit
Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.Psymon can even cheer up an android equipped with a defective Genuine Personality Prototype.
 
Psymon's Avatar
 
Posts: 394
Karma: 30686
Join Date: May 2013
Device: iPad, ADE
Quote:
Originally Posted by mrmikel View Post
>>If it's just not really doable or practical, well, I'll just scrap the idea -- but >>even if it works in some readers and then for others just shows the text but no >>background image at all (without "breaking" anything), I could live with that.

The only problem with that is which ones it breaks on, unless this is not a commercial job, just for your own use. It can be hard to test for all of them.
Well, if it worked in most readers and displayed the way it's supposed to, that would be great, and for the others if the way that it "broke" was simply that the background image didn't show up (but there was no issues with the text chapter titles that would be on top of that), then that would be okay. I just wouldn't want to do something that might "break" things in a way that would ruin things that shouldn't be ruined.
Psymon is offline   Reply With Quote
Old 11-26-2013, 05:21 PM   #25
RbnJrg
Evangelist
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 483
Karma: 318996
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by Psymon View Post
Well, I'm frustrated -- again. I spent hours last night doing up all 20+ chapter title pages in that SVG method you posted, Rubén, and although they all look great now, I'm such a dummy that it was only after I'd spent all that time fixing up every chapter title so that it would look nice -- which is a total pain to do when you have to adjust everything with pixels rather than just specifying a heading or paragraph or whatever -- that it hit me that in the process I'd invariably lost all my <h1> tags (duh!) and hence none of the chapters were getting marked to the table of contents either.
My english is not so good so I don't understand you very well; what is your issue now? The problem is that you lost all <h1> tags? If the text over your background image works fine, then the another issue is trivial.

According to what I posted, indeed, there is not any <h1> tag so it can't appear in the TOC . Suppose you have something like that:

Code:
<div>
  <svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 533 800" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
    <image height="800" width="533" xlink:href="../Images/bamboo_fence.jpg"></image>

    <text fill="red" style="font-size: 50px" text-anchor="middle" x="266.5" y="200">
      This Here

      <tspan x="266.5" y="280">Is A</tspan>

      <tspan x="266.5" y="370">Chapter Title</tspan>
    </text>

    <image height="63" width="63" x="235" xlink:href="../Images/ornament.png" y="450"></image>

    <text fill="green" style="font-size: 30px; font-style: italic" text-anchor="middle" x="266.5" y="600">By Author</text>
  </svg>
</div>
Then do the following:

1. First, in your stylesheet.css file, add this:

Code:
h1 {
    display: none;
}
2. Now above the <div> tags where you enclose your svg wraper write:

Code:
<h1 title="Whatever be the title you want here">&nbsp;</h1>
Of this way, you'll end with something like this:

Code:
<h1 title="Whatever be the title you want here">&nbsp;</h1>

<div>
  <svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 533 800" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
    <image height="800" width="533" xlink:href="../Images/bamboo_fence.jpg"></image>

    <text fill="red" style="font-size: 50px" text-anchor="middle" x="266.5" y="200">
      This Here

      <tspan x="266.5" y="280">Is A</tspan>

      <tspan x="266.5" y="370">Chapter Title</tspan>
    </text>

    <image height="63" width="63" x="235" xlink:href="../Images/ornament.png" y="450"></image>

    <text fill="green" style="font-size: 30px; font-style: italic" text-anchor="middle" x="266.5" y="600">By Author</text>
  </svg>
</div>
Now regenerate the TOC by pressing Ctrl+T in Sigil. You'll see what you want to see

Quote:
I couldn't get this to work for me -- at least, not with that background image that I've been using. I'm assuming that I'm doing something wrong, but I don't know what. That background image is 1200x1800, but I adjusted the code you gave at the above link to give the image a height of 900.

In Sigil it looks fine -- and I haven't looked yet, but I'm guessing it probably would look fine in iBooks -- but in ADE it doesn't work at all.
I don't know why is not working in ADE for you; maybe you are doing something wrong; see this screenshot of my ADE:

Click image for larger version

Name:	ADE1.jpg
Views:	38
Size:	87.5 KB
ID:	115806

Could you post here the image you are using and the text you want to write over it? Maybe of that way I can say you more things about what to do.

Regards
Rubén
Attached Files
File Type: epub background_image_test_ruben.epub (68.2 KB, 14 views)
RbnJrg is offline   Reply With Quote
Old 11-27-2013, 03:58 AM   #26
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,312
Karma: 4963983
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Why do you need a <div>? Can't you just have the SVG code inside ah <h1>?

Code:
<h1 title="Chapter title">
  <svg xmlns="http://www.w3.org/2000/svg" ...>
    ...
  </svg>
</h1>
Jellby is offline   Reply With Quote
Old 11-27-2013, 06:13 AM   #27
RbnJrg
Evangelist
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 483
Karma: 318996
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by Jellby View Post
Why do you need a <div>? Can't you just have the SVG code inside ah <h1>?

Code:
<h1 title="Chapter title">
  <svg xmlns="http://www.w3.org/2000/svg" ...>
    ...
  </svg>
</h1>
That is because in theory, you can't enclose a svg wrapper inside <h>, <p> and some others tags. Sigil allows the use you propose but maybe some ereaders doesn't and Psymon is a "purist" and he want to use a svg wrapper instead of a background image because he fears that some devices doesn't show that image. For that reason I used a <div> container.
RbnJrg is offline   Reply With Quote
Old 11-27-2013, 08:22 AM   #28
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,312
Karma: 4963983
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Quote:
Originally Posted by RbnJrg View Post
That is because in theory, you can't enclose a svg wrapper inside <h>, <p> and some others tags.
"In theory"? The only restriction I'm aware with <svg> is that it can be wherever <img> is allowed. This means it can be in <div> (or <p> or <hX>), but not directly inside <body> or <blockquote>, for instance. Is there some other restriction? Do you have a link for that?

Now, if you'd said "in practice", meaning that some readers choke with that, I'd fine with it (I don't know if that's the case, though)

(Anyway, this is something that only affects automatic TOC generation/update with Sigil. You can always create the NCX by hand and add whatever links and names you want, regardless of the HTML code.)
Jellby is offline   Reply With Quote
Old 11-27-2013, 12:01 PM   #29
RbnJrg
Evangelist
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 483
Karma: 318996
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by Jellby View Post
"In theory"? The only restriction I'm aware with <svg> is that it can be wherever <img> is allowed. This means it can be in <div> (or <p> or <hX>), but not directly inside <body> or <blockquote>, for instance. Is there some other restriction? Do you have a link for that?
If you for example, in Sigil, enclose a svg wrapper inside a <blockquote> you'll see that Sigil allows that and shows the svg perfectly in both, the Book View and Preview. But if after that you want to validate the ePub with FlighCrew, you'll get a message saying:

element 'svg' is not allowed for content model '(p|h1|h2|h3|h4|h5|h6|div|ul|ol|dl|pre|hr|blockquote|address|fieldset|table|switch|form|noscript|ins|d el|script)'

(The curious thing is that, in that list, also is included div )

Of course, the svg COULDN'T BE inside <blockquote> tags but it WORKS and also WORKS in ADE!!! (below I attach a working ePub with a svg enclosed in blockquotes tags; of course, it doesn't validate, but working).

So, in order to avoid problems, I decided that the better thing was to enclose the svg inside a DIV.

Quote:
(Anyway, this is something that only affects automatic TOC generation/update with Sigil. You can always create the NCX by hand and add whatever links and names you want, regardless of the HTML code.)
Agree. For that reason is that I told Psymon that if that was his problem, then it was a trivial thing to solve it
Attached Files
File Type: epub background_image_test_ruben.epub (68.2 KB, 16 views)
RbnJrg is offline   Reply With Quote
Old 11-27-2013, 12:15 PM   #30
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,312
Karma: 4963983
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Quote:
Originally Posted by RbnJrg View Post
If you for example, in Sigil, enclose a svg wrapper inside a <blockquote> you'll see that Sigil allows that and shows the svg perfectly in both, the Book View and Preview. But if after that you want to validate the ePub with FlighCrew, you'll get a message saying:

element 'svg' is not allowed for content model '(p|h1|h2|h3|h4|h5|h6|div|ul|ol|dl|pre|hr|blockquote|address|fieldset|table|switch|form|noscript|ins|d el|script)'

(The curious thing is that, in that list, also is included div )
Exactly. As I said above, <svg> (or <img>) is not allowed to be the direct child of a <blockquote>, because <blockquote> can only have block-level children. That's not a surprise.

But I think you misunderstand the message. The list is not giving all the elements where <svg> is forbidden, but all the elements that are allowed there: and "svg" (or "img") is not in the list, hence the error.

The case with <p> or <hX> is entirely different. Those can have character-level children, and therefore <svg> or <img>. Do you get validation errors with <svg> inside <p> or <hX>?
Jellby 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
Kindle paperwhite crop background-image on top/bottom j.puff@ppp.eu Kindle Formats 2 08-28-2013 12:58 PM
Kindle paperwhite crop background-image on top/bottom j.puff@ppp.eu Kindle Developer's Corner 1 08-26-2013 07:02 PM
iBooks: Text overflowing image if it's at top of screen. Oxford-eBooks ePub 30 05-10-2013 01:56 AM
Image overlayed over text (but text visible if image disabled)? Kaylee Skylyn ePub 5 08-01-2012 06:27 PM
Background image djrulz Kindle Formats 1 03-29-2011 05:51 PM


All times are GMT -4. The time now is 06:10 AM.


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