View Full Version : Chapter Head Text Over Image


theducks
09-02-2010, 06:36 PM
My CSS skills are basic :)
I am trying to mimic the printed version.

I have an Image that is used on every chapter
On that (in the lower 1/3) I want the chapter digit (text). see attachment

The problem is if I re-flow (zoom) on my reader text, the digit moves out of place (ugly).

How do I stop the re-size of just this text (64 Images is not the answer type I want :p )

Existing coding :
/* Overlay Chapter digit */

/* the code withe the problem */

<p class="calibre5"></p>

<div class="overall">
<p class="big1 calibre8 middle"><br />
&nbsp;<br />
&nbsp; 1</p>
</div>

<p class="calibre8 sgc-2"><br class="calibre2" /></p>


/* ========== the CSS pieces ============*/
div.overall {
display: block;
background-image: url("../Images/image02.gif");
background-repeat: no-repeat;
background-position: center;
height: 424px;
width: 180;
position: relative;
top: 10
}
div.middle{
position: relative;
margin-top: 5
}

.big1 {
display: block;
font-size: 5em;
font-weight: normal;
margin-bottom: 0.5em;
margin-left: 0;
margin-right: 0;
margin-top: .5em;
text-align: center;
text-indent: 0
}
.calibre8 {
font-style: italic
}

dmapr
09-02-2010, 07:15 PM
Specify the font-size for the text in pixels.

theducks
09-02-2010, 07:24 PM
Specify the font-size for the text in pixels.

It still moves, BUT it stays put (centered)
:thanks: :thanks:

dmapr
09-02-2010, 07:49 PM
Sorry, for some reason I thought you were talking about changing the font size, not using the zoom function. I never used zoom, so I don't know how that works. Can you get away with using font sizes instead of zooming or is it something not available on Astak?

dmapr
09-02-2010, 07:58 PM
Just tried zoom on my reader, and it seems to work fine.

theducks
09-02-2010, 08:02 PM
Just tried zoom on my reader, and it seems to work fine.

Maybe it is Sigil? I need to send to my reader, I am making the changes to the epub now :thumbsup:

dmapr
09-02-2010, 08:18 PM
Maybe it is Sigil? I need to send to my reader, I am making the changes to the epub now :thumbsup:

You'll post the end result, right? ;)

charleski
09-02-2010, 08:43 PM
Specify the margins in pixels as well.

theducks
09-02-2010, 08:44 PM
You'll post the end result, right? ;)

ADE (on my reader) won't center images (known) that heading, but the rest WORKS :thumbsup: as desired.
Calibre viewer renders the font a bit funny, but it works there.


Are you referring to the code? (PM if other)

dmapr
09-03-2010, 02:41 PM
ADE (on my reader) won't center images (known) that heading, but the rest WORKS :thumbsup: as desired.
Calibre viewer renders the font a bit funny, but it works there.

Are you referring to the code? (PM if other)
No, sorry for misunderstanding — I meant the end result of the investigation, i.e. the report of how successful it was on the reader — and that you did :)

Bummer about the centering… perhaps at some point the ADE in your reader will be updated?

theducks
09-03-2010, 03:32 PM
No, sorry for misunderstanding — I meant the end result of the investigation, i.e. the report of how successful it was on the reader — and that you did :)

Bummer about the centering… perhaps at some point the ADE in your reader will be updated?

II was less than clear on the results. :smack:

VERY GOOD. The digits (the text), stay right where I wanted them at reasonable Zoom points (even at Zoom 5, the highest on my PEz. And the image is part off screen at that zoom :rofl: )
Much :thanks: