CSS override working for font, not dd indent

FlaSheridn · 10-29-2010, 12:49 PM

I’ve got some poetry where the lines are marked with style dd, and I need to remove the left margin to fit on the iPhone, or iPad in two-page mode. The following does override the font (necessary for some Old English characters) but not the indentation. (I got the idea from http://www.the-art-of-web.com/css/format-dl/, plus some old CSS (tweaked and reversed) I use with Safari to get real paragraphs in normal text.)

dd { font-family: "Times New Roman, Times"; text-indent: 0em ! important; margin: 0 ! important; padding: 0 0 0 0 ! important}

(See also https://www.mobileread.com/forums/showthread.php?t=77553 and https://www.mobileread.com/forums/sho...d.php?t=104038.)

jackie_w · 10-29-2010, 04:02 PM

I think it might help if you posted a bit of the source HTML showing how the <dd> tag is used and anything in the CSS like dd {...} dt {...} dl{...}

Also, if the HTML looks like

Code:

<dd class="xyz">...</dd>

then post any parts of the CSS like

Code:

.xyz {...} or dd.xyz {...}

JSWolf · 10-29-2010, 04:17 PM

Font family declarations like that will not work on the iPhone/iPad using iBooks. iBooks does not respect it in most cases and to get it to work is not worth it as Apple will only come out with a new iBooks that breaks it. So forget embedded fonts or specifying what font you want with iBooks. It doesn't work or it doesn't work well.

FlaSheridn · 10-31-2010, 03:06 PM

Quote:

Originally Posted by jackie_w

I think it might help if you posted a bit of the source HTML…

Also, if the [ePub?] HTML looks like

Code:

<dd class="xyz">...</dd>

then post any parts of the CSS like

Code:

.xyz {...} or dd.xyz {...}

Thanks; once I looked at the ePub converted HTML, it became clear that it was simply a Calibre bug, which I’ll file:

Source HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Genesis A, B</title>
</head>
<body>
<h1>Genesis A, B</h1>
<p><cite>Verse Indeterminate Unknown</cite></p>
<dl compact>
<dt></dt>
<dd>
Us is riht micel      ðæt we rodera weard, <br>
wereda wuldorcining,      wordum herigen, <br>
modum lufien!      He is mægna sped, <br>
heafod ealra      heahgesceafta, <br>
</dd>

ePub XHTML:
<?xml version='1.0' encoding='utf-8'?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Genesis A, B</title>
<meta content="http://www.w3.org/1999/xhtml; charset=utf-8" http-equiv="Content-Type"/><link href="stylesheet1.css" type="text/css" rel="stylesheet"/><style type="text/css">
@page { margin-bottom: 5.000000pt; margin-top: 5.000000pt; }</style></head>
<body class="calibre">
<h1 class="calibre1" id="calibre_pb_0">Genesis A, B</h1>
<p class="calibre5"><cite class="calibre6">Verse Indeterminate Unknown</cite></p>
<dl compact="compact" class="calibre11"><dt class="calibre7"/>
<dd class="calibre12">
Us is riht micel **** ðæt we rodera weard, <br class="calibre7"/>
wereda wuldorcining, **** wordum herigen, <br class="calibre7"/>
modum lufien! **** He is mægna sped, <br class="calibre7"/>
heafod ealra **** heahgesceafta, <br class="calibre7"/></dd>

ePub CSS:

.calibre12 {
display: block;
font-family: "Times New Roman, Times";
margin-bottom: 0;
margin-left: 40px;
margin-right: 0;
margin-top: 0;
text-indent: 0
}

10-29-2010, 12:49 PM	#1
FlaSheridn Junior Member Posts: 8 Karma: 10 Join Date: Dec 2007 Device: iPad, iPhone, Kindle 1	CSS override working for font, not dd indent I’ve got some poetry where the lines are marked with style dd, and I need to remove the left margin to fit on the iPhone, or iPad in two-page mode. The following does override the font (necessary for some Old English characters) but not the indentation. (I got the idea from http://www.the-art-of-web.com/css/format-dl/, plus some old CSS (tweaked and reversed) I use with Safari to get real paragraphs in normal text.) dd { font-family: "Times New Roman, Times"; text-indent: 0em ! important; margin: 0 ! important; padding: 0 0 0 0 ! important} (See also https://www.mobileread.com/forums/showthread.php?t=77553 and https://www.mobileread.com/forums/sho...d.php?t=104038.)

10-29-2010, 04:02 PM	#2
jackie_w Grand Sorcerer Posts: 6,212 Karma: 16534894 Join Date: Sep 2009 Location: UK Device: Kobo: KA1, ClaraHD, Forma, Libra2, Clara2E. PocketBook: TouchHD3	I think it might help if you posted a bit of the source HTML showing how the <dd> tag is used and anything in the CSS like dd {...} dt {...} dl{...} Also, if the HTML looks like Code: <dd class="xyz">...</dd> then post any parts of the CSS like Code: .xyz {...} or dd.xyz {...}

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Embedding Chinese font using CSS override?	kome17	Calibre	0	09-18-2009 12:57 AM
css override code for margins?	Amalthia	Calibre	15	08-11-2009 07:20 PM
IMG css override not working anymore?	Amalthia	Calibre	10	08-03-2009 01:12 AM
help with Claibre CSS override	sideburnt	Calibre	7	05-28-2009 08:25 PM
css override code for <h2> and <h1> tags	Amalthia	Calibre	2	03-29-2009 06:51 PM

10-29-2010, 04:17 PM	#3
JSWolf Resident Curmudgeon Posts: 73,970 Karma: 128903378 Join Date: Nov 2006 Location: Roslindale, Massachusetts Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3	Font family declarations like that will not work on the iPhone/iPad using iBooks. iBooks does not respect it in most cases and to get it to work is not worth it as Apple will only come out with a new iBooks that breaks it. So forget embedded fonts or specifying what font you want with iBooks. It doesn't work or it doesn't work well.

Advert