View Full Version : iBooks ignoring a:link css style


Alan Newson
03-15-2012, 12:25 PM
Hi, I'm trying to give a ePub links within iBooks a custom color, but it seems they are being ignored.

I have an external style sheet with the following code:

.contact-web {
text-align: left;
font-size: 0.8em;
font-weight: bold;
margin-bottom: 0em;
-webkit-hyphens: none;
}

.contact-web a {color:#000;text-decoration:none;}
.contact-web a:visited {color:#000;text-decoration:none;}
.contact-web a:hover {color:#000;text-decoration:none;}
.contact-web a:active {color:#000;text-decoration:none;}


And the code I'm trying to link it to within my html is:

<p class="contact-web">For more information, please visit <a href="http://www.mysite.com">www.mysite.com</a></p>


Is it possible to change the color of an ePub hyperlink that works within iBooks?

Thanks

Toxaris
03-15-2012, 12:44 PM
Why don't you just use the following definition in your stylesheet.

a {
color:#000;
text-decoration:none;
}

That would be sufficient.

Alan Newson
03-15-2012, 12:49 PM
Yes, that's what I thought. It works on ADE, but when you take it into iBooks on the iPad the link goes back to the default purple.

Keroberos
03-15-2012, 01:25 PM
Shouldn't color codes be like these, "color:#000000;" (hex), or "color:rgb(0,0,0);" (rgb value), or "color:black;" (color name)?

mmat1
03-15-2012, 04:18 PM
Shouldn't color codes be like these, "color:#000000;" (hex), or "color:rgb(0,0,0);" (rgb value), or "color:black;" (color name)?

You're right, all these declarations are valid, but #000 as well.

If I were Allen, i would try any of these.

wqoq
03-15-2012, 04:22 PM
3 digit Hex values are also viable. It's a short-hand for double digits. Saves 3 bytes!

em { color: #69b } /* #rgb */
em { color: #6699bb } /* #rrggbb */

See:
http://www.w3.org/TR/CSS2/syndata.html#color-units
http://www.w3.org/TR/css3-color/#numerical

JSWolf
03-15-2012, 04:25 PM
iBooks does what iBooks wants. And that isn't always the way we think it should work.

Keroberos
03-15-2012, 05:20 PM
Valid, yes. But not necessarily supported. I've read that some renderers don't support three digit hex so I avoid it and stick with the six digit.

Alan Newson
03-19-2012, 08:13 AM
I haven't managed to get the css to control the a:link color within iBooks. But have found out that putting a <span> around the text, inside the <a> tags lets you define a colour.

Probably not ideal. But it did the job for me.

Toxaris
03-19-2012, 08:49 AM
That is typical iBooks... A lot of unnecessary <span> tags required.