Need help with css again

[BeccaPrice]

I'm reading a book with a very wide left margin. I exploded it, and edited the css file to remove all the left margin notes and the indents, but there's still a very wide margin on the left. Can somebody look at the css for me and tell me what the problem is?

Thanks! (I'm still very new to this game)

Spoiler:

.bold {
font-weight: bold
}
.calibre {
display: block;
font-size: 0.875em;
line-height: 1.2;
margin-bottom: 0;
margin-left: 0;
margin-right: 0pt;
margin-top: 0;
padding-left: 0;
padding-right: 0
}
.calibre1 {
display: table-row;
vertical-align: middle
}
.calibre10 {
border-bottom: 0;
border-top: 0;
display: block;
margin-bottom: 0.5em;
margin-left: 0;
margin-right: 0;
margin-top: 0.5em;
padding-bottom: 0;
padding-top: 0;
text-align: center
}
.calibre11 {
font-size: 1em
}
.calibre12 {
height: 73px;
width: 132px
}
.calibre13 {
font-size: 1.28571em;
line-height: 1.2
}
.calibre14 {
height: 50px;
width: 41px
}
.calibre15 {
color: blue;
cursor: pointer;
text-decoration: underline
}
.calibre16 {
border-bottom: 0;
border-top: 0;
display: block;
margin-bottom: 0.5em;
margin-left: 0;
margin-right: 0;
margin-top: 0.5em;
padding-bottom: 0;
padding-top: 0;
text-align: center;
text-indent: 0
}
.calibre17 {
color: rgb(0, 0, 0);
font-size: 1.28571em;
line-height: 1.2
}
.calibre18 {
border-bottom: 0;
border-top: 0;
display: block;
height: 2em;
margin-bottom: 0.5em;
margin-top: 0.5em;
padding-bottom: 0;
padding-top: 0
}
.calibre19 {
color: rgb(0, 0, 0);
font-size: 0.85714em
}
.calibre2 {
display: block
}
.calibre20 {
font-size: 1.5em;
line-height: 1.2
}
.calibre21 {
display: block;
margin-bottom: 0;
margin-left: 1em;
margin-right: 0;
margin-top: 0
}
.calibre22 {
font-family: sans-serif
}
.calibre3 {
color: white
}
.calibre4 {
display: block;
font-size: 0.875em;
line-height: 1.2;
margin-bottom: 0;
margin-left: 0;
margin-right: 5pt;
margin-top: 0;
padding-left: 0;
padding-right: 0;
text-align: justify
}
.calibre5 {
border-bottom: 0;
border-top: 0;
display: block;
margin-bottom: 0.5em;
margin-top: 0.5em;
padding-bottom: 0;
padding-top: 0
}
.calibre6 {
display: block;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
margin-top: 0
}
.calibre7 {
border-bottom: 0;
border-top: 0;
display: block;
margin-bottom: 0.5em;
margin-left: 0;
margin-right: 0;
margin-top: 0.5em;
padding-bottom: 0;
padding-top: 0;
text-align: left
}
.calibre8 {
font-size: 1.14286em;
line-height: 1.2
}
.calibre9 {
font-size: 0.85714em
}
.cbjbanner {
-webkit-border-radius: 8px;
background: #eee;
border: thin solid black;
border-bottom: 0;
border-top: 0;
color: black;
display: block;
margin-bottom: 0.5em;
margin-left: 0;
margin-right: 1em;
margin-top: 0.5em;
padding-bottom: 0;
padding-left: 0;
padding-right: 1em;
padding-top: 0
}
.cbjcomments {
border-bottom: 0;
border-top: 0;
display: block;
font-family: sans-serif;
margin-bottom: 0.5em;
margin-top: 0.5em;
padding-bottom: 0;
padding-top: 0
}
.cbjcontent {
display: table-cell;
font-family: sans-serif;
padding-bottom: 1px;
padding-left: 0;
padding-right: 1px;
padding-top: 1px;
text-align: left;
vertical-align: inherit;
}
.cbjfooter {
border-bottom: 0;
border-top: 0;
display: block;
font-family: sans-serif;
font-size: 0.85714em;
margin-bottom: 0.5em;
margin-top: 0.5em;
padding-bottom: 0;
padding-top: 0;
text-align: center
}
.cbjheader {
border-collapse: separate;
border-spacing: 2px;
display: table;
margin-bottom: 0;
margin-top: 0;
text-indent: 0;
width: 100%
}
.cbjkindlebannerhr {
border: 1px inset;
border-bottom: 2px solid black;
border-left: 0 solid white;
border-right: 0 solid white;
border-top: 0 solid white;
color: gray;
display: block;
height: 2px;
margin-bottom: 0.5em;
margin-left: 10%;
margin-right: auto;
}
.cbjlabel {
display: table-cell;
font-family: sans-serif;
padding-bottom: 1px;
padding-left: 1px;
padding-right: 1px;
padding-top: 1px;
text-align: right;
vertical-align: inherit;
}
.cbjpubdata {
display: table-cell;
padding-bottom: 1px;
padding-left: 1px;
padding-right: 1px;
padding-top: 1px;
text-align: center;
vertical-align: inherit
}
.cbjseries {
display: table-cell;
font-size: 1em;
line-height: 1.2;
padding-bottom: 1px;
padding-left: 1px;
padding-right: 1px;
padding-top: 1px;
text-align: center;
vertical-align: inherit
}
.cbjtitle {
display: table-cell;
font-size: 1.42857em;
font-style: italic;
line-height: 1.2;
padding-bottom: 1px;
padding-left: 1px;
padding-right: 1px;
padding-top: 1px;
text-align: center;
vertical-align: inherit
}
.description {
border-bottom: 0;
border-top: 0;
display: block;
margin-bottom: 0.5em;
margin-left: 0;
margin-right: 0;
margin-top: 0.5em;
padding-bottom: 0;
padding-top: 0
}
.italic {
font-style: italic
}
.metadatadivider {
border: 1px inset;
border-bottom: solid black 1px;
border-left: solid white 0;
border-right: solid white 0;
border-top: solid white 0;
color: gray;
display: block;
height: 2px;
margin-bottom: 0.5em;
margin-right: auto;
margin-top: 0.5em;
}
.title {
line-height: 1.2
}
.underline {
text-decoration: underline
}

[DoctorOhh]

Originally Posted by BeccaPrice

I'm reading a book with a very wide left margin. I exploded it, and edited the css file to remove all the left margin notes and the indents, but there's still a very wide margin on the left. Can somebody look at the css for me and tell me what the problem is?

Besides .css margins can be in .xpgt templates and there can be @page margins in the html itself. The Quality Check plugin will allow you to check for these types of margins and the Modify ePub plugin will allow you to remove these types of margins.

The css you supplied looked clean.

[theducks]

Originally Posted by BeccaPrice

I'm reading a book with a very wide left margin. I exploded it, and edited the css file to remove all the left margin notes and the indents, but there's still a very wide margin on the left. Can somebody look at the css for me and tell me what the problem is?

Thanks! (I'm still very new to this game)

There does not seem to be any SINGLE big margin-left:

to know what affects a paragraph, we need to know the class of th paragraph, the class of a surrounding div (if any)
EPUB is like Ogres (which is like Onions: Layers )
What you may have is:
1: a invalid/incorrect Link statement so it is not using this stylesheet
2: there is a xpgt sheet that is overriding (use the QC plugin to remove)
3: there is an error in the stylsheet tat ADE tris on and ignores all or part. Validate at http://jigsaw.w3.org/css-validator/#validate_by_upload

[Perkin]

2b. style assignments in the < head > section of the html files which are overriding any others.

[theducks]

Originally Posted by Perkin

2b. style assignments in the < head > section of the html files which are overriding any others.

Forgot about the Last definition of a style rule.

I have been bit by a double or spllt definition of a selector and wondered why the Inspector (a right click option in the Viewer) showed different than it said in the First (an what I thought, was the only) definition.
I now use a program called Free CSS Toolbox to sort my (long) CSS

[BeccaPrice]

I ran Modify ePub plugin, with "Remove @page and body margin styles" selected, but that didn't seem to do any good either.

I've installed the Quality Check plugin, but can't find it on any of the menus to run it. How do I run the Quality Check plugin on the file?

[theducks]

Originally Posted by BeccaPrice

I ran Modify ePub plugin, with "Remove @page and body margin styles" selected, but that didn't seem to do any good either.

I've installed the Quality Check plugin, but can't find it on any of the menus to run it. How do I run the Quality Check plugin on the file?

You missed the configuration step (only) at first install
Now you will need to customize the Menus in preferences, where you will see it on the right, and you need to make it appear on the left of your chosen menu(s)

[BeccaPrice]

Where in Preferences do i go to change the menus? I've been looking at the Preferences screen, even went into the Plugin screen, and don't see any way to get at the menus.

I looked at configure the plugin, and didn't see any way to do it there either.

(I installed a bunch of plugins when I didn't know what I was doing - and unfortunately, missed a bunch of stuff. Now I'm paying for it!)

[BeccaPrice]

is right - it's under "toolbar" and I was looking for "menu"

it is now fixed, and I can run quality check on the book.

[BeccaPrice]

ok, and I'm not terribly bright today. I found how to quality check only a selected book. I've got the book only in epub, and checked the epub styles, and it apparently came out clean.

I went in to the html files themselves looking for problems - it turns out every paragraph is in blockquote tags. It's too much work to go into every single html file and delete the blockquote tags by hand - I guess I'll just have to put up with a wide left margin as I read.

thanks for all the help and suggestions!

[JSWolf]

Without seeing the XML code, the problem is probably here...

.calibre21 {
display: block;
margin-bottom: 0;
margin-left: 1em;
margin-right: 0;
margin-top: 0
}

If your XML is using mostly <p class="calibre21"> or <div class="calibre21"> then you have to change the 1em left margin.

[BeccaPrice]

I didn't think 1em would be that significant, but it makes a major difference in the display - thanks!

there's still more of a left margin than I need, but it's much more readable now.

[Perkin]

It could be being used (nested) multiple times, body, div, p, could all be using it and also could be nested divs, so each 1em being added together could soon mount up to a large margin, especially if your using larger fonts.

[kiwidude]

I think from what Becca said above all the paragraphs are enclosed in blockquote tags. Does the Kindle "hard code" a margin for a blockquote if it is not specified on the style?

You could just open the ePub in Sigil and "blow away" all those <blockquote> tags - so the <p> tags are using only whatever class style is associated with them (which following the advice from JSWolf should now be zero for left margin).

[BeccaPrice]

Did the calibre21 style:

Spoiler:

.calibre21 {
display: block;
margin-bottom: 0;
margin-left: 1em;
margin-right: 0;
margin-top: 0

define the blockquote?

looking at the html, I see a lot of this:

Spoiler:

<blockquote class="calibre6"><p class="calibre7"><span class="calibre19"><span><span class="calibre20">O</span></span><span>

but just changing the "margin-left: 1em;" in calibre21 fixed everything - I didn't have to change it in all the other class=calibrexx calls. I wonder if everything is defined in terms of calibre21 somewhere in the css?

whatever, it's fixed now, and much more readable. each time this happens to me, I learn more and more about what to look for in my .css files.