10-31-2012, 11:33 AM | #1 |
Zealot
Posts: 101
Karma: 202774
Join Date: Apr 2012
Device: none
|
Feedback on CSS?
Did I get it right, can one post one´s CSS for reactions and feedback?
In that case, I welcome feedback on my CSS and a small representative snippet from my book. The text here is not my own, just some random stuff from E. Britannica. There is no real continutiy, just a catalog of different, recurring patterns in my book. (I should perhaps mention that the book is a music manual for youngish singers. English is not my native language, nor is the book written in that language.) PLEASE NOTE: I am mainly interested in feedback on my CSS (the construction of which is a quite new thing to me). You might have views, even violent ones, on the way I construct my page. I am less interested in that. I am an writer (that´s how I pay my rent), and not a designer, programmer or typographer. I have noted that typograpy is one of the stiffest, most purist and most resistant to change-domains. I do NOT wish to enter into a polemic about those things. I have given a lot of thought to how I want my book to look, so please respect that and do not regard me as a thoughtless beginner. Ok? Sorry for sounding so defensive. I´ve had bad experiences with anal typographers. PS: In another thread I have discussed footnotes with some of you. In brackets you can see my "solution" to this. I omitted the *-s which otherwise signal "footnote" , so basically what we have at the end of the 4-th paragraph is not a footnote, but auxilary text in smaller case within brackets. Last edited by GraciousMe; 10-31-2012 at 11:35 AM. |
10-31-2012, 12:09 PM | #2 |
frumious Bandersnatch
Posts: 7,516
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
Some comments:
Code:
@page {margin: 1.3em} Code:
body { font-family: "Garamond"; } Code:
p { text-align: left; } Code:
intro { letter-spacing: 0.09em; } Code:
<p class="tom"> </p> |
10-31-2012, 10:46 PM | #3 | |
Booklegger
Posts: 1,801
Karma: 7999816
Join Date: Jun 2009
Location: Toronto, Ontario, Canada
Device: BeBook(1 & 2010), PEZ, PRS-505, Kobo BT, PRS-T1, Playbook, Kobo Touch
|
Quote:
My own feeling is that since margins in @page can only reduce the usable area, I'd rather not have any @page specification at all (in an EPUB file). But that's just me, I suppose. |
|
11-01-2012, 07:33 AM | #4 |
Color me gone
Posts: 2,089
Karma: 1445295
Join Date: Apr 2008
Location: Central Oregon Coast
Device: PRS-300
|
You might look at:
http://www.w3schools.com/css/. Quite basic and straightforward and it allows you to try it out so you can see the effect of changes. |
11-01-2012, 12:12 PM | #5 |
Zealot
Posts: 101
Karma: 202774
Join Date: Apr 2012
Device: none
|
Thanks for your valuable input. At least part of my CSS is copied from manuals, etc. that I don´t really understand. For example this one: @page {margin: 1.3em} Most of your suggestion is about removing stuff. I have a question about this one, though. <p class="tom"> </p> >Do not do that. You just want some vertical space, use vertical (top/bottom) margins, or a block element with fixed height. That's not a paragraph and there's no content to have there, don't add vertical space with "empty lines". Margins of what? Block element...? I feel freer being able to just insert a blank space, more independent than having to change another element. |
11-02-2012, 07:46 AM | #6 | |
frumious Bandersnatch
Posts: 7,516
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
Quote:
Code:
<h1>Chapter Title</h1> <p class="tom"> </p> <p class="tom"> </p> <div class="intro"> Short introductory text. </div> <p class="tom"> </p> <p class="first">First paragraph</p> Margins: Code:
<h1>Chapter Title</h1> <div class="intro"> Short introductory text. </div> <p class="first">First paragraph</p> Code:
h1 { margin-bottom: 1.5em; } div.intro { margin-bottom: 1em; } Code:
<h1>Chapter Title</h1> <div class="big_spacer"> </div> <div class="intro"> Short introductory text. </div> <div class="spacer"> </div> <p class="first">First paragraph</p> Code:
div.big_spacer { height: 2em; } div.spacer { height: 1em; } |
|
11-02-2012, 09:06 AM | #7 |
Zealot
Posts: 101
Karma: 202774
Join Date: Apr 2012
Device: none
|
Thanks. The reason I would prefer the block element before the margin-solution is that in one chapter I have a... don´t know what it is called... A heading like this:
THE UNIVERSE or How to boil an egg With those bigger margins for h1 the distance between the lines gets too big. |
11-03-2012, 12:15 PM | #8 | |
Grand Sorcerer
Posts: 11,470
Karma: 13095790
Join Date: Aug 2007
Location: Grass Valley, CA
Device: EB 1150, EZ Reader, Literati, iPad 2 & Air 2, iPhone 7
|
Quote:
Dale |
|
11-03-2012, 03:37 PM | #9 |
frumious Bandersnatch
Posts: 7,516
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
A possible solution
Code:
<h1>THE UNIVERSE <span class="subtitle">or<br/> How to boil an egg</span></h1> |
11-03-2012, 08:11 PM | #10 |
Well trained by Cats
Posts: 29,801
Karma: 54830978
Join Date: Aug 2009
Location: The Central Coast of California
Device: Kobo Libra2,Kobo Aura2v1, K4NT(Fixed: New Bat.), Galaxy Tab A
|
|
11-04-2012, 04:53 AM | #11 |
frumious Bandersnatch
Posts: 7,516
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
I was actually thinking of having something like:
Code:
span.subtitle {
display: block;
font-size: 80%;
margin-top: 0.5em;
}
|
11-05-2012, 08:03 PM | #12 |
Well trained by Cats
Posts: 29,801
Karma: 54830978
Join Date: Aug 2009
Location: The Central Coast of California
Device: Kobo Libra2,Kobo Aura2v1, K4NT(Fixed: New Bat.), Galaxy Tab A
|
|
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
To all your feedback – for which many thanks! | Graham Coulson | General Discussions | 0 | 09-18-2011 08:32 AM |
Override ePub CSS with userStyle.css? | barium | Sony Reader Dev Corner | 11 | 07-16-2011 03:25 PM |
epub CSS versus "Regular" CSS | konrad | ePub | 4 | 02-18-2011 09:29 AM |
css pseudo elements and adjacent combinators in extra css? | ldolse | Calibre | 2 | 12-21-2010 05:09 PM |
Some feedback please | twr | Amazon Kindle | 7 | 09-14-2010 03:28 PM |