View Full Version : help with css


bobcdy
02-12-2010, 10:07 PM
Help! I'm trying to learn css for formatting epubs, and I think its going ok, but I have one problem I can't figure out: it's the importance of the sequence in the css. For example, the following css seems to work fine in both sigil and Adobe DE, but if I change the sequence and put the blockquote element before div.indent, then <div. blockquote> works in sigil but not in Adobe DE. Same problem if the h1,h2,h3, etc. is higher in the sequence. I wouldn't worry much about Adobe DE except that my Bebook reacts in the same way with epubs.

Does anyone know why the location in the css is so important to Adobe DE? Perhaps there something fundamentally wrong with the following css? Any help will be greatly appreciated!

body {background: #ffffcc;
margin top: 0em;
margin bottom: 0em;
margin right: 0em;
margin left: 0em; }
-->

div.indent {text-indent: 3%;text-align: justify;}
div.center {text-align:center;}
h1,h2,h3,h4,h5,h6 {color:black; text-align:center;}
img.sgc-7 {height: 100%;}

div.blockquote {font-size: 85%; color: #0000FF;
margin-right: 5em;
margin-left: 5em;
margin-top: 2em;
margin-bottom: 2em}

Bob

bobcdy
02-12-2010, 10:10 PM
There should be a <!-- at the top of the css.
Bob

bobcdy
02-13-2010, 11:59 AM
I found the answer with some experimenting. The css should have looked like this:

body {background: #ffffcc;}
div.blockquote {font-size: 85%;
text-align: justify;
color: #0000FF;
margin-top: 2em;
margin-bottom: 2em;
margin-right: 2em;
margin-left: 2em; }
h1,h2,h3,h4,h5,h6 {color:black;
text-align:center;}
div.indent {text-indent: 3%;
text-align: justify;
margin-top: 0em;
margin-bottom: 0em;
margin-right: 0em;
margin-left: 0em; }
div.center {text-align:center;}
img.sgc-7 {height: 100%;}

Bob