Font size issue in Sigil-Please help

rosshalde · 11-15-2014, 03:41 PM

Ok,
So I am brand new to this.
Sometimes font size is listed in "em". Other times, in percentage. What does the percentage in reference to? Is 100%=1em? If not, please help me understand.
What I want is for all the words other than "Two Letters"
to be the same size. The body and the letter should be identical. I can't seem to adjust the font size in the letter at all.....is there a problem with the my code?

Here is the small code I am dealing with and also the css that is applied

<?xml version="1.0" encoding="UTF-8" standalone="no" ?><!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" xml:lang="en" xmlns:xml="http://www.w3.org/XML/1998/namespace">
<head>
<title>1 Section 1 | Misericordia Readers – Third Reader</title>
<meta content="C1C8EF7E-849A-46CC-B6E7-D9A687A694EB" name="EPB-UUID"/>

<link href="../Styles/Style0001.css" rel="stylesheet" type="text/css"/></head>

<body>
<div class="body" style="white-space:normal">
<h1 class="s1 s4">Two Letters</h1>

<p class="s1 s3">When George Washington was seven years old, he moved with his parents to a home on a plantation called Ferry Farm. The house stood on a hill not far from a river. A beautiful piece of meadowland ran down from the house to the water. Here Washington and his brothers and sister played with their friends.</p>

<p class="s1 s3">In a field not far away was a little school, taught by a man named Mr. Hobby. Here George learned his A,B,C’s, and how to read and write. Mr. Hobby’s school was not a very good one, because Mr. Hobby himself knew only a little reading, writing, and arithmetic. There were few good schools at that time in the whole of our country.</p>

<p class="s1 s3">Another little boy, who afterward became a great general, went to Mr. Hobby’s school with Washington. His name was Richard Henry Lee, and he and George were very good friends. As soon as these two boys learned to write and spell, they began to write letters to each other. Here are two letters they wrote when they were nine years old.</p>

<p class="s1 s3">Richard Henry Lee to George Washington:</p>

<div class="letter">
<p>DEAR GEORGE,</p>

<p>Pa brought me two pretty books full of pictures. He got them in Alexandria. They have pictures of dogs and cats and tigers and elephants and ever so many things in them. Cousin bids me send you one of them. It has a picture of an elephant with a little Indian boy like Uncle Joe’s Sam on his back. Pa says if I do my tasks well he will let Uncle Joe bring me to see you. Will you ask your Ma to let you come to see me?</p>

<p class="sign">Your friend,</p>

<p class="sign">RICHARD HENRY LEE</p>
</div>

here is the css

sup{
font-size: 67%;
vertical-align: 33%;
}
sub{
font-size: 67%;
vertical-align: -10%;
}
body, div, p, h1, h2, h3, h4 { margin: 0; padding: 0; }
p{
margin: 0px;
}
.s1{
color: #000000;
font-size: 75.0000%;
font-style: normal;
font-variant: normal;
font-weight: normal;
letter-spacing: 0.0000em;
margin-bottom: 0.0000%;
margin-top: 0.0000%;
padding-left: 0.0000%;
padding-right: 0.0000%;
text-align: left;
text-decoration: none;
text-indent: 0.0000%;
text-transform: none;
}

}
.s3{
text-align: justify;
text-indent: 7.6923%;
white-space: normal;
}
.s4{
font-size: 87.5000%;
font-weight: bold;
text-align: center;
}

.letter {margin-left: 3em; margin-right: 3em; }
.letter p{text-indent: 0; text-align: justify; font size: 1em; margin-top: 1.25em;}
.letter p.sign {text-align: right;}

RbnJrg · 11-15-2014, 04:32 PM

Quote:

Originally Posted by rosshalde

Ok,
So I am brand new to this.
Sometimes font size is listed in "em". Other times, in percentage. What does the percentage in reference to? Is 100%=1em? If not, please help me understand.

It is linked with the font-size of the parent object. For example, supose you have a <div> tag with a font size of 1.2em. Besides you have a class for all <p> tags inside that <div> where the font-size is defined as 80%. Then all of those <p> will have a font-size of 1.2em x 80% = 0.96em. In your case, the font-size is linked with the font-size of the class "body" (A VERY BAD NAME; this is cause of future troubles)

Quote:

What I want is for all the words other than "Two Letters"
to be the same size. The body and the letter should be identical. I can't seem to adjust the font size in the letter at all.....is there a problem with the my code?

Here is the small code I am dealing with and also the css that is applied

Code:

<?xml version="1.0" encoding="UTF-8" standalone="no" ?><!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" xml:lang="en" xmlns:xml="http://www.w3.org/XML/1998/namespace">
<head>
  <title>1 Section 1 | Misericordia Readers – Third Reader</title>
  <meta content="C1C8EF7E-849A-46CC-B6E7-D9A687A694EB" name="EPB-UUID"/>
  
<link href="../Styles/Style0001.css" rel="stylesheet" type="text/css"/></head>

<body>
  <div class="body" style="white-space:normal">
    <h1 class="s1 s4">Two Letters</h1>

    <p class="s1 s3">When George Washington was seven years old, he moved with his parents to a home on a plantation called Ferry Farm. The house stood on a hill not far from a river. A beautiful piece of meadowland ran down from the house to the water. Here Washington and his brothers and sister played with their friends.</p>

    <p class="s1 s3">In a field not far away was a little school, taught by a man named Mr. Hobby. Here George learned his A,B,C’s, and how to read and write. Mr. Hobby’s school was not a very good one, because Mr. Hobby himself knew only a little reading, writing, and arithmetic. There were few good schools at that time in the whole of our country.</p>

    <p class="s1 s3">Another little boy, who afterward became a great general, went to Mr. Hobby’s school with Washington. His name was Richard Henry Lee, and he and George were very good friends. As soon as these two boys learned to write and spell, they began to write letters to each other. Here are two letters they wrote when they were nine years old.</p>

    <p class="s1 s3">Richard Henry Lee to George Washington:</p>

    <div class="letter">
      <p>DEAR GEORGE,</p>

      <p>Pa brought me two pretty books full of pictures. He got them in Alexandria. They have pictures of dogs and cats and tigers and elephants and ever so many things in them. Cousin bids me send you one of them. It has a picture of an elephant with a little Indian boy like Uncle Joe’s Sam on his back. Pa says if I do my tasks well he will let Uncle Joe bring me to see you. Will you ask your Ma to let you come to see me?</p>

      <p class="sign">Your friend,</p>

      <p class="sign">RICHARD HENRY LEE</p>
    </div>

here is the css

Code:

sup{
	font-size: 67%;
	vertical-align: 33%;
}

sub{
	font-size: 67%;
	vertical-align: -10%;
}

body, div, p, h1, h2, h3, h4 { margin: 0; padding: 0; }

p{
	margin: 0px;
}

.s1{
	color: #000000;
	font-size: 75.0000%;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	letter-spacing: 0.0000em;
	margin-bottom: 0.0000%;
	margin-top: 0.0000%;
	padding-left: 0.0000%;
	padding-right: 0.0000%;
	text-align: left;
	text-decoration: none;
	text-indent: 0.0000%;
	text-transform: none;
}

}

.s3{
	text-align: justify;
	text-indent: 7.6923%;
	white-space: normal;
}

.s4{
	font-size: 87.5000%;
	font-weight: bold;
	text-align: center;
}

.letter {margin-left: 3em; margin-right: 3em; }
.letter p{text-indent: 0; text-align: justify; font size: 1em; margin-top: 1.25em;}
.letter p.sign {text-align: right;}

Your styles are not, hmmm..., very optimized

I should use:

Code:

sup {
 	font-size: 67%;
	vertical-align: 33%;
}

sub {
  	font-size: 67%;
	vertical-align: -10%;
}

body, div, p, h1, h2, h3, h4 { margin: 0; padding: 0; }

.container {
       font-size: 1.33em; /* THIS IS A NEW STYLE */
}

p {
	margin: 0px; /* I'll supress this style because it doesn't make anything */
}

.s1{
	color: #000000;
	font-size: 75.0000%;
	font-style: normal;
 	font-variant: normal;
 	font-weight: normal;
 	letter-spacing: 0.0000em;
 	margin-bottom: 0.0000%;
	margin-top: 0.0000%;
	padding-left: 0.0000%;
	padding-right: 0.0000%;
	text-align: left;
	text-decoration: none;
	text-indent: 0.0000%;
	text-transform: none;
}

} /*THIS } MUST BE ERASED */

.s3 {
	text-align: justify;
	text-indent: 1.2em; /* I'd use this indent */
	white-space: normal;
}

.s4{
  	font-size: 87.5000%;
 	font-weight: bold;
 	text-align: center;
}

.letter {margin-left: 3em; margin-right: 3em; }
.letter p{text-indent: 0; text-align: justify; font size: 1em; margin-top: 1.25em;}
.letter p.sign {text-align: right;}

And my .xhtml file would be:

Code:

<?xml version="1.0" encoding="UTF-8" standalone="no" ?><!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" xml:lang="en" xmlns:xml="http://www.w3.org/XML/1998/namespace">
<head>
  <title>1 Section 1 | Misericordia Readers – Third Reader</title>
  <meta content="C1C8EF7E-849A-46CC-B6E7-D9A687A694EB" name="EPB-UUID"/>
  
<link href="../Styles/Style0001.css" rel="stylesheet" type="text/css"/></head>

<body>
  <div class="container">
    <h1 class="s1 s4">Two Letters</h1>

    <p class="s1 s3">When George Washington was seven years old, he moved with his parents to a home on a plantation called Ferry Farm. The house stood on a hill not far from a river. A beautiful piece of meadowland ran down from the house to the water. Here Washington and his brothers and sister played with their friends.</p>

    <p class="s1 s3">In a field not far away was a little school, taught by a man named Mr. Hobby. Here George learned his A,B,C’s, and how to read and write. Mr. Hobby’s school was not a very good one, because Mr. Hobby himself knew only a little reading, writing, and arithmetic. There were few good schools at that time in the whole of our country.</p>

    <p class="s1 s3">Another little boy, who afterward became a great general, went to Mr. Hobby’s school with Washington. His name was Richard Henry Lee, and he and George were very good friends. As soon as these two boys learned to write and spell, they began to write letters to each other. Here are two letters they wrote when they were nine years old.</p>

    <p class="s1 s3">Richard Henry Lee to George Washington:</p>

    <div class="letter">
      <p>DEAR GEORGE,</p>

      <p>Pa brought me two pretty books full of pictures. He got them in Alexandria. They have pictures of dogs and cats and tigers and elephants and ever so many things in them. Cousin bids me send you one of them. It has a picture of an elephant with a little Indian boy like Uncle Joe’s Sam on his back. Pa says if I do my tasks well he will let Uncle Joe bring me to see you. Will you ask your Ma to let you come to see me?</p>

      <p class="sign">Your friend,</p>

      <p class="sign">RICHARD HENRY LEE</p>
    </div>

The code below should work

Regards
Rubén

11-15-2014, 03:41 PM	#1
rosshalde Zealot Posts: 142 Karma: 10 Join Date: Jun 2014 Device: nook	Font size issue in Sigil-Please help Ok, So I am brand new to this. Sometimes font size is listed in "em". Other times, in percentage. What does the percentage in reference to? Is 100%=1em? If not, please help me understand. What I want is for all the words other than "Two Letters" to be the same size. The body and the letter should be identical. I can't seem to adjust the font size in the letter at all.....is there a problem with the my code? Here is the small code I am dealing with and also the css that is applied <?xml version="1.0" encoding="UTF-8" standalone="no" ?><!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" xml:lang="en" xmlns:xml="http://www.w3.org/XML/1998/namespace"> <head> <title>1 Section 1 \| Misericordia Readers – Third Reader</title> <meta content="C1C8EF7E-849A-46CC-B6E7-D9A687A694EB" name="EPB-UUID"/> <link href="../Styles/Style0001.css" rel="stylesheet" type="text/css"/></head> <body> <div class="body" style="white-space:normal"> <h1 class="s1 s4">Two Letters</h1> <p class="s1 s3">When George Washington was seven years old, he moved with his parents to a home on a plantation called Ferry Farm. The house stood on a hill not far from a river. A beautiful piece of meadowland ran down from the house to the water. Here Washington and his brothers and sister played with their friends.</p> <p class="s1 s3">In a field not far away was a little school, taught by a man named Mr. Hobby. Here George learned his A,B,C’s, and how to read and write. Mr. Hobby’s school was not a very good one, because Mr. Hobby himself knew only a little reading, writing, and arithmetic. There were few good schools at that time in the whole of our country.</p> <p class="s1 s3">Another little boy, who afterward became a great general, went to Mr. Hobby’s school with Washington. His name was Richard Henry Lee, and he and George were very good friends. As soon as these two boys learned to write and spell, they began to write letters to each other. Here are two letters they wrote when they were nine years old.</p> <p class="s1 s3">Richard Henry Lee to George Washington:</p> <div class="letter"> <p>DEAR GEORGE,</p> <p>Pa brought me two pretty books full of pictures. He got them in Alexandria. They have pictures of dogs and cats and tigers and elephants and ever so many things in them. Cousin bids me send you one of them. It has a picture of an elephant with a little Indian boy like Uncle Joe’s Sam on his back. Pa says if I do my tasks well he will let Uncle Joe bring me to see you. Will you ask your Ma to let you come to see me?</p> <p class="sign">Your friend,</p> <p class="sign">RICHARD HENRY LEE</p> </div> here is the css sup{ font-size: 67%; vertical-align: 33%; } sub{ font-size: 67%; vertical-align: -10%; } body, div, p, h1, h2, h3, h4 { margin: 0; padding: 0; } p{ margin: 0px; } .s1{ color: #000000; font-size: 75.0000%; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: 0.0000em; margin-bottom: 0.0000%; margin-top: 0.0000%; padding-left: 0.0000%; padding-right: 0.0000%; text-align: left; text-decoration: none; text-indent: 0.0000%; text-transform: none; } } .s3{ text-align: justify; text-indent: 7.6923%; white-space: normal; } .s4{ font-size: 87.5000%; font-weight: bold; text-align: center; } .letter {margin-left: 3em; margin-right: 3em; } .letter p{text-indent: 0; text-align: justify; font size: 1em; margin-top: 1.25em;} .letter p.sign {text-align: right;}

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
KF8, Sigil, and font size	Paddlin	Kindle Formats	0	04-24-2012 05:41 PM
PRS-350 Dictionary and font size issue?	amujee	Sony Reader	13	02-19-2011 10:48 PM
More on working around the font-size issue	billingd	Kobo Reader	13	06-25-2010 08:49 PM
Hacks Font Size Issue	relayer250	Amazon Kindle	3	12-30-2009 12:02 AM
Why is Sigil changing the font size?	djloewen	Sigil	6	12-25-2009 09:41 AM

Advert