text alignment issue

[Hitch]

Shaina:

Where are the style definitions, for those two chapters, in which sgc-5 is defined? THAT is what we need to see.

Hitch

[shaina]

All of my sgc definitions are defined in css, there are no sgc definitions or styles defined in any of the chapters and if you want to look at the css its below:

.sgc {
display: block;
font-size: 2em;
font-weight: bold;
line-height: 1.2;
margin-bottom: 0.67em;
margin-left: 0;
margin-right: 0;
margin-top: 0.67em;
position: relative;
text-align: center;
top: 200px
}
.sgc1 {
display: block;
font-size: 2em;
font-weight: bold;
line-height: 1.2;
margin-bottom: 0.67em;
margin-left: 0;
margin-right: 0;
margin-top: 0.67em;
text-align: center
}
.sgc10 {
border: none;
display: block;
margin-bottom: 0;
margin-left: 40px;
margin-right: 0;
margin-top: 0;
padding-bottom: 0;
padding-left: 0;
padding-right: 0;
padding-top: 0
}
.sgc11 {
display: block;
font-style: italic;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
margin-top: 1em;
text-align: center
}
.sgc12 {
display: block;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
margin-top: 1em;
text-align: left
}
.sgc13 {
font-weight: bolder
}
.sgc14 {
display: inline;
list-style-image: none;
list-style-position: outside;
list-style-type: none
}
.sgc15 {
display: block;
font-style: italic;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
margin-top: 1em
}
.sgc16 {
display: block;
font-style: italic;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
margin-top: 1em;
text-align: left
}
.sgc17 {
display: block;
font-weight: bold;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
margin-top: 1em;
text-align: left
}
.sgc18 {
font-style: normal;
font-weight: bold
}
.sgc19 {
display: block;
font-style: italic;
font-weight: bold;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
margin-top: 1em;
text-align: left
}
.sgc2 {
display: block;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
margin-top: 1em;
text-align: center
}
.sgc20 {
font-style: normal
}
.sgc3 {
display: block;
font-size: 1.29167em;
line-height: 1.2;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
margin-top: 1em;
text-align: center;
}
.sgc4 {
display: block;
text-align: center
}
.sgc5 {
display: block;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
margin-top: 1em;
text-align:justify
}

.sgc6 {
display: block;
font-weight: bold;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
margin-top: 1em;
text-align: justify
}
.sgc7 {
display: block;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
margin-top: 1em;
position: relative;
text-align: center;
top: 250px
}
.sgc8 {
display: table-cell;
font-weight: bold;
padding-bottom: 1px;
padding-left: 1px;
padding-right: 1px;
padding-top: 1px;
text-align: inherit;
vertical-align: inherit
}
.sgc9 {
display: table-cell;
font-style: italic;
padding-bottom: 1px;
padding-left: 1px;
padding-right: 1px;
padding-top: 1px;
text-align: inherit;
vertical-align: inherit
}
.sgc21 {
display: block;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
margin-top: 1em;
text-align: left
}

[DaleDe]

Did you move these CSS entries from the HTML files to the CSS file? Normally SGC is assigned by Sigil and is in the HTML file. It is assigned independently from its meaning in another file in the eBook. Moving them to the CSS could possibly change the meaning. For example sgc21 in the first HTML file might be defined differently that it was in the 6th file. It may be that forcing all HTML files to use the same definition by removing them from the head area of the HTML file is causing a paragraph to use a different style in one html file than it is in another. This is just a guess as I don't know how the CSS was created.

Dale

[theducks]

I highly recommend that you DON'T use SGC coding in your stylesheet.
It will cause confusion
AND
If you happen to do something in Sigil that creates a Local version of the same code ,
it will take precedence.

Believe in Murphy..
Avoid doing things in ways that help errors happen
Pick your own names for selectors or at least modify them in ways that could never be generated by Sigil (or Calibre), just to avoid confusion.

[shaina]

i tried it using different css too... but was of no use ... is it like <p> and <div> tag behave differently in ibooks or doesnt support alignment in lower versions of the xhtml or html ??

[Hitch]

As has been discussed here before, certain alignments in certain elements do not behave properly in iBooks unless they (improperly) contain other empty elements, e.g., spans; however, you have something else entirely occurring, and I suspect it's the "sgc" styling codes.

If I were in your shoes, I'd go through and regex every instance of, say, "sgc-5" which you intended to be a p code, and then style sgc-5 with a meaningful name in your CSS sheet as you want it to be. If you are trying to FORCE the reader to use a fully-justified text (which is, BTW, considered by many to be bad form, meaning, people don't like to have full-justification "forced" on them, FWIW), then try using empty spans inside the paragraph tags if your CSS doesn't work alone for the p formatting.

I would not rely upon ANY div formatting for chapter- or book-wide formatting overrides. I'd get rid of all those "sgc" CSS classes and name everything, then regex and replace everything with their proper class names...otherwise, you're just going to be going around in circles forever, and no one here can help you--at least I can't--because it APPEARS as though all the CSS was copy-and-pasted from various file headers inside the xhtml--which means you could have all sorts of cascading messes going on in there.

That's my best advice. Clean up the whole epub by changing your CSS classes, one at a time, and giving them proper names. Regex the ePUB itself and replace the sgc classes with the new names, and test it, one styling change at a time. It's tedious, but it's the only way to really troubleshoot a problem this disorganized. If you change 5 things at once, you don't have a control element to know what the hell you did that worked.

HTH.
Hitch

[JSWolf]

Originally Posted by shaina

Chapter not accepting the alignment
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>WEB3.0</title>
<meta content="true" name="HandheldFriendly" />
<link href="../Styles/stylesheet.css" rel="stylesheet" type="text/css" />
<style type="text/css">



/*<![CDATA[*/

@page { margin-bottom: 5.000000pt; margin-top: 5.000000pt; }
/*]]>*/
</style>
</head>
Chapter Accepting alignment
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>WEB3.0</title>
<meta content="true" name="HandheldFriendly" />
<link href="../Styles/stylesheet.css" rel="stylesheet" type="text/css" />
<style type="text/css">

/*<![CDATA[*/

@page { margin-bottom: 5.000000pt; margin-top: 5.000000pt; }
/*]]>*/
</style>
</head>

i dont know about the problem with sgc class but i tried it other ways too for experiments,
1. Defining p class in css.
2.by defining body class in css.
but of no use.

You will want to go into each XML file and remove...

<style type="text/css">



  /*<![CDATA[*/

                @page { margin-bottom: 5.000000pt; margin-top: 5.000000pt; }
  /*]]>*/
  </style>

all of that garbage. You don't need and the read doesn't want a 5pt top/bottom margin forced on them.

[JSWolf]

Originally Posted by shaina

i tried it using different css too... but was of no use ... is it like <p> and <div> tag behave differently in ibooks or doesnt support alignment in lower versions of the xhtml or html ??

iBooks has an option in the iOS Options app for changing the alignment. You get either full justified or left justified.

[Perkin]

Just for an example of how sgc-# classes get confusing....

In chapter-1.html, first style applied is bold, therefore sgc-1 is bold, second style applied is italic, therefore sgc-2 is italic.

In chapter-2.html, first style applied is italic, therefore sgc-1 is italic, second style applied is underline, therefore syle sgc-2 is underline.

Now if you were to try to combine these into a single stylesheet - what order and styles would each of the sgc-#'s be, as you copy sgc-1&2 from file chapter-1, then as you think you would check chapter-2, sgc-1&2 are already defined so you skip copying them, BUT the definitions are different so you get a result that isn't what you wanted.

As many have said, rename the styles in the stylesheet.css to meaningful names then change the classes definitions in the chapter files by S&R, you'll then have an easier time seeing where things are wrong.

[shaina]

thanks to all of you for the valuable advice .... but nothing seems working like i said before i also tried developing book with another css which i m pasting below but the bug continues i m not able to get it why only <p> tags have the problem with style rest all tags seems working fine.
css:
.cover{text-align:center;
font-weight:bold;
font-size:2em;

}
p{ background-color: #FFF;
display: block;
font-size: 1em;
margin-bottom: 0;
margin-left: 5pt;
margin-right: 5pt;
text-align:justify;}
h1{ text-align:center;
font-weight:bold;
font-size:1.5em;
}
h2{ text-align:left;
display:block;
font-weight:bold;
font-size:1em;
}
li{ text-align:justify;
display:block;
font-size:1em;
}
.sub{ text-align:center;
display:block;
}
.sub1{
text-align:center;
font-style:italic;}
.foot{
text-align:left;}

[Toxaris]

Please post at least part of the ePUB instead of just some CSS code. It will help. You might try using <span></span> around the text. So: <p><span>your paragraph.</span></p>. I heard iBooks is stupid enough to actually do something then. Personally when I come across this I would remove the <span> since it does nothing....

[JSWolf]

Shaina, did you check the options in the options app to see if iBooks is set to full justify?