[FM Discuss] css help

Rebecca Hargrave Malamud webchick at invisible.net
Sun Aug 29 04:38:18 PDT 2010


Excellent - thanks so much!

Eager to explore more with the chapter heading hacks ... I think the 
version we picked up did not have that information 
(http://lists.flossmanuals.net/pipermail/discuss-flossmanuals.net/2010-July/003995.html) 
... so I missed it the first time around :-)

I am relatively certain that Christopher uploaded the CF stylesheet just 
for kicks to see what would happen and the fonts did not come across. 
So, the fonts were recently added, or something was awry on our end. 
Anything is possible at this stage of development - I will test it again 
when I am at my studio.

I am happy to add any new research and discoveries to Mushon's post - he 
certainly has in-depth knowledge on the topic ...

Great work!

> ----------------------------------------------------------------------
>
> Message: 1
> Date: Sat, 28 Aug 2010 23:38:50 +0200
> From: adam hyde <adam at flossmanuals.net>
> To: fm <discuss at lists.flossmanuals.net>
> Subject: [FM Discuss] [Fwd: Re: css help]
> Message-ID: <1283031530.1496.168.camel at esetera>
> Content-Type: text/plain; charset="UTF-8"
>
> -------- Forwarded Message --------
> From: Mushon Zer-Aviv <mushon at shual.com>
> To: adam at flossmanuals.net
> Subject: Re: css help
> Date: Sat, 28 Aug 2010 16:44:27 -0400
>
> My response:
>
> Re: fonts
> True, the CSS is dependent on the "Palatino Linotype" & " Gentium Book
> Basic" fonts, but both of these are currently available on Objavi, so
> there was no problem there.
>
> Re: page-breaks
> I had a similar concern with page breaks and as I was working on the
> book with two different sizes I implemented two different print-hack css
> files as you might have noticed on collaborative-futures.org:
>         /* Main CSS File: */
>         @import url("http://collaborative-futures.org/material/styles.css");
>         
>         /* Uncomment based on the book size you export: */
>         
>         /* A5 */
>         /* @import url("http://collaborative-futures.org/material/size/a5-hacks.css"); */
>         
>         /* 5.5"x8.5" */
>         /* @import url("http://collaborative-futures.org/material/size/5.5x8.5-hacks.css");*/
> The idea is that you can refer to the size-specific css you want based
> on what size you're printing in.
> Check the css files themselves to see how I did the hacks, I have all of
> them commented. Here are is an example:
>
>         /* push these ones (mainly headings) to the next page: */
>         #chapter-3 > h2:nth-of-type(1),
>         #chapter-3 > h2:nth-of-type(2),
>         #chapter-3 > h2:nth-of-type(3),
>         #chapter-3 > h2:nth-of-type(6),
>         
>         #chapter-6 > h2:nth-of-type(5),
>         
>         #chapter-9 > h2:nth-of-type(1),
>         #chapter-9 > h2:nth-of-type(4),
>         
>         #chapter-13 > h2:nth-of-type(2),
>         
>         #chapter-16 > h2:nth-of-type(2),
>         
>         #chapter-19 > h2:nth-of-type(2),
>         #chapter-23 > h3:nth-of-type(2),
>         
>         #chapter-25 > h2:nth-of-type(2),
>         #chapter-25 > h2:nth-of-type(5),
>         #chapter-26 > div:nth-of-type(1),
>         #chapter-32 > h2:nth-of-type(3),
>         
>         #chapter-36 > h2:nth-of-type(2),
>         
>         #chapter-45 > h2:nth-of-type(5)
>         {
>           page-break-before: always;
>           
>           /* check if/where this is working by uncommenting this*/
>           /* background: #eee; */
>         }
>         
>         /* Break long paragraphs between pages here: */
>         #chapter-3 > p:nth-last-of-type(2),
>         #chapter-14 > p,
>         #chapter-19 > p,
>         #chapter-23 > p,
>         #chapter-26 > p:nth-of-type(4),
>         #chapter-31 > p:nth-last-of-type(6),
>         #chapter-37 > p,
>         #chapter-38 > ul,
>         #chapter-39 > p:nth-last-of-type(2){
>           page-break-inside: auto;
>         
>           /* check if/where this is working by uncommenting this*/
>           /* background: #fee; */
>         }
>         
>         /* Don't break the glossary divs on these ones: */
>         #chapter-3 div.glossary,
>         #chapter-34 div,
>         #chapter-46 div:nth-last-of-type(1){
>           page-break-inside: avoid;
>         }
>         
>         /* Ugly cheat to solve an empty page bug: */
>         #chapter-21 > p{
>           line-height: 1.35em;
>         }
> Most of these issues will be automated once the rendering engine we're
> using implements the page-break-after: avoid; rule.
> Until then my solution is tedious but still the least tedious I could
> think of.
> (we actually implemented chapter IDs especially to make sure this hack
> is doable)
>
> I will write a more detailed post about it for the Booki blog in the
> next few weeks.
>
> cheers and good luck!
> Mushon Zer-Aviv
> ? Shual.com - design studio
> ?  ShiftSpace.org - an opensource layer above any website
> ?  Mushon.com - blog
> ? @mushon - Tweet me
> + 1-646-283-6057 
>
>
>
> On 8/28/10 1:54 AM, adam hyde wrote: 
>   
>> hey
>>
>> there are some people walking the same path as you as can be seen here:
>> http://lists.flossmanuals.net/pipermail/discuss-flossmanuals.net/2010-August/004228.html
>>
>> http://lists.flossmanuals.net/pipermail/discuss-flossmanuals.net/2010-August/004230.html
>>
>>
>> i was wondering if u had a moment to subscribe or send me an email and i
>> can fwd with some tips of formatting the book with css esp with regard
>> to paragraph breaks
>>
>> adam
>>
>>
>>
>>     
>
>   




More information about the Discuss mailing list