12-28-2012, 07:38 PM | #1 |
Enthusiast
Posts: 48
Karma: 10
Join Date: Aug 2011
Device: Ipad
|
How to make specific words change color when using embedded fonts?
Hi all!
This is for Kindle KF8 and iBooks. I tried it in the following way but the problem is that the embedded fonts do not want to apply to the span tags. Do you know any solution? (FYI <div class="titleboxcolor"> makes the text background black.) HTML Code:
<div class="titleboxcolor"> <h2 id="toc_marker-2-1" class="title">White text</h2> <h2 class="title"><span>Red text</span></h2> <h2 class="title">White text</h2> </div> Code:
h2 {font-family:"Myriad Pro Black", sans-serif; font-size:4.167em; font-weight:900; line-height:1.2 ; margin-top:0px; text-transform:uppercase; } h2.title span { color:#c0081f; } h2.title { color:#FFFFFF; } |
12-29-2012, 04:02 AM | #2 |
frumious Bandersnatch
Posts: 7,531
Karma: 19000001
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
Do you have the problem only with embedded fonts? I'd say it's more likely that the reader is trying to be smart by setting all text colours to black...
Other comments probably unrelated to your issue: -I believe your markup is wrong, you have three titles, where you probably simply want one title with three components, why not use something like (I think it's more semantic): Code:
<h2> <span class="top">White text</span> <span class="middle">Red text</span> <span class="bottom">White text</span> </h2> h2 { background-color: #000000; color: #FFFFFF; } h2 span { display: block; } h2 span.middle { color: #C0081F; } |
Advert | |
|
12-29-2012, 07:12 AM | #3 |
Enthusiast
Posts: 48
Karma: 10
Join Date: Aug 2011
Device: Ipad
|
Thanks for the tip about the semantics, I really appreciate it. The span tags work for KF8 and iBooks, they become red like I want them. It's just that the embedded font "Myriad Pro Black" does not apply to them, but applies to the rest.
|
12-29-2012, 08:26 AM | #4 |
frumious Bandersnatch
Posts: 7,531
Karma: 19000001
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
So, you have something like:
Code:
<h2>This <span>that</span></h2> |
12-29-2012, 09:33 AM | #5 |
Curmudgeon
Posts: 629
Karma: 1623086
Join Date: Jan 2012
Device: iPad, iPhone, Nook Simple Touch
|
Probably a cascade bug. Try adding:
Code:
h2 span {font-family:"Myriad Pro Black", sans-serif; font-size:4.167em; font-weight:900; line-height:1.2 ; margin-top:0px; text-transform:uppercase; } |
Advert | |
|
01-07-2013, 03:09 PM | #6 |
Resident Curmudgeon
Posts: 75,840
Karma: 134368292
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
FunkeXMix are you doing all of this work for a paid job you've been given to do? If so, look for help elsewhere. most at MR do not like being taken advantage of by being asked all kinds of questions from someone who is getting paid (and not telling us so from the start) and having us do the work for them.
If you are not getting paid to do this work, then feel free to keep asking for help. Last edited by JSWolf; 01-07-2013 at 03:14 PM. |
01-09-2013, 09:09 AM | #7 |
Enthusiast
Posts: 48
Karma: 10
Join Date: Aug 2011
Device: Ipad
|
My goal is to create a discussion about topics that have not been covered here before, adding to the knowledge base, as well as learning more about SVGs in regards to what works on Kindle and iPad.
It is an exiting way to create interesting layouts without the need for fixed layout, and from what I can Google there is not much coverage of it in regards to what works in eBooks. Me and dgatwood had interesting discussions on the topic of SVG balling our ideas back and forth. Except for this one thread title, I even paid attention to making easy to find titles for the threads so people can find them easily here and on Google. I am here to give and receive, I already gave some input on another persons SVG thread, then dgatwood gave his input as well. I will most certainly use my attained knowledge to earn money by making better looking eBooks, and so can anybody who reads my threads. I think we are doing good things here. And while I get better I will be able to offer more help. That's why people even share their information, what comes around goes around. Last edited by FunkeXMix; 01-09-2013 at 02:20 PM. |
01-09-2013, 09:18 AM | #8 |
Enthusiast
Posts: 48
Karma: 10
Join Date: Aug 2011
Device: Ipad
|
Sorry double post. Can be deleted.
Last edited by FunkeXMix; 01-09-2013 at 02:17 PM. |
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
Can you change Kindle fonts or make it open epubs? | sonyreaderfan | Amazon Kindle | 1 | 03-15-2012 02:22 AM |
embedded fonts | Wally S | Workshop | 15 | 01-21-2012 03:57 PM |
Embedded fonts | dicknskip | Sigil | 27 | 12-01-2011 09:24 AM |
Embedded fonts? | Greenmantle | Kobo Reader | 66 | 07-27-2011 08:20 PM |
Embedded fonts, Calibre, and choice of fonts | AlexBell | ePub | 8 | 05-30-2010 06:00 AM |