Text alignment in Hebrew

odedta · 09-23-2014, 11:30 AM

When I convert a validated epub3 to mobi using KindlePreviewer
I get two results, one in Calibre which is the correct form where the text is aligned to the right and another result in mobi where the text is aligned to the left, this happens only in unordered lists for some reason.

The HTML & CSS:

Code:

<ul class="margin_bottom margin_top_3">

    <li>- "<b>דון רואיס רואס</b> זכה זה עתה בפרס השני באותה השנה. נאום התודה שלו הדליק את משואת ההשראה בלבם של מאזיניו הוותיקים, וגרם אף לספקנים שבקהל לקבל את עצם זכייתו..."</li>

    <li>- "<b>איווון דקארט</b> היה..."</li>

    <li>- "<b>סומר אספניו</b> חשב שהוא חושב שהוא, אבל אור היום המתהדר בצבעי תכלת ארגמניים הקיצו מחלומותיו בהקיץ..."</li>

</ul>

<p class="indented">כל השמות שעלו במוחי נראו לי יותר מדי מוכנים, יותר מדי בשלים, יותר מדי בנויים בשביל הסיפור שלי. לסיפור שלי צריך להיות אם לא עלילה, אז לפחות גיבור שיגדל ויבשיל עם הקורא. הוא לא יכול להיות עוד גיבור נכזב שמצא וחווה את חייו בין הצלחה לכישלון אחד מהדהד וממושמע. הוא צריך להיות גיבור שיזדהה עם הקורא אפילו עוד לפני שזה יזדהה איתו.</p>

CSS is attached.

I would like the list items to be aligned to the right.

Thanks.

Doitsu · 09-23-2014, 01:11 PM

Since you forgot to attach your css file, it's hard to tell what the exact problem is. Did you define rtl for the body tag?

Code:

body {direction: rtl;}

or

Code:

<body dir="rtl">...</body>

odedta · 09-23-2014, 01:29 PM

The computed CSS shows exactly the CSS rules I applied to the html.

I always use dir="rtl" since it's a must for EPUB3 validation. I also tried to ad the direction:rtl through inline styling and it didn't work.

Doitsu · 09-23-2014, 01:56 PM

Quote:

Originally Posted by odedta

The computed CSS shows exactly the CSS rules I applied to the html.

It doesn't indicate the text direction, though. For this and many other reasons it helps to see the actual CSS for all elements. For example, I assume that you hide the auto-generated bullet symbol via CSS. All this is not obvious from the CSS screenshot and any one of these style definitions might affect the overall display of the text.

BTW, with body {direction: rtl;}, the text appears to be properly aligned on my Kindle PW2.

odedta · 09-23-2014, 07:08 PM

Well, I did that and nothing changed, I even used !important, no result...

Why are you caught on to CSS not attached? all there is are two classed about margin-top and margin-bottom :/ anyway, this is the general CSS:

Code:

body {
  font-family: "FRealBeletBook";
  font-size: 1em;
  font-weight: normal;
  text-align: justify;
  margin: 5pt 5pt 0 5pt;
}
ul {
  font-family: "Fb FRealBeletBook";
}
li {
  display: block;
}
p {
  line-height: 1.338em;
}
.margin_top_3 {
  margin-top: 1em;
}
.margin_bottom {
  margin-bottom: 2em;
}

Doitsu · 09-24-2014, 05:19 AM

I just did a quick test with your CSS, and the compiled .mobi file looked OK on my PW2 and Kindle for iOS app, but not with the Kindle for PC app.

Most likely, the Kindle for PC app uses a different rendering engine. If you want to achieve 100% compatibility, you might have to experiment with tables or other HTML elements.

BTW, the firmware of eInk Kindles does not support embedded fonts for RTL languages; RTL languages will always be rendered with the glyphs from the code2000 fallback font. (You cannot see this in my screen capture, because I installed a font override that uses the Hebrew glyphs from Arial.)

odedta · 09-24-2014, 07:53 AM

Ah! Great information there Doitsu! Thank you very much for your help, i will keep on experimenting.

09-23-2014, 01:11 PM	#2
Doitsu Grand Sorcerer Posts: 5,640 Karma: 23191067 Join Date: Dec 2010 Device: Kindle PW2	Since you forgot to attach your css file, it's hard to tell what the exact problem is. Did you define rtl for the body tag? Code: body {direction: rtl;} or Code: <body dir="rtl">...</body>

09-23-2014, 07:08 PM	#5
odedta Addict Posts: 398 Karma: 96448 Join Date: Dec 2013 Device: iPad	Well, I did that and nothing changed, I even used !important, no result... Why are you caught on to CSS not attached? all there is are two classed about margin-top and margin-bottom :/ anyway, this is the general CSS: Code: body { font-family: "FRealBeletBook"; font-size: 1em; font-weight: normal; text-align: justify; margin: 5pt 5pt 0 5pt; } ul { font-family: "Fb FRealBeletBook"; } li { display: block; } p { line-height: 1.338em; } .margin_top_3 { margin-top: 1em; } .margin_bottom { margin-bottom: 2em; }

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Text Alignment Options	cnote	Kindle Formats	5	01-14-2013 04:39 AM
Hello/Image and text alignment	Derek R	Introduce Yourself	3	06-26-2011 11:47 AM
PRS-650 Text and alignment issues	henders254	Sony Reader	0	05-14-2011 09:11 PM
Text Alignment Problem	fan of kovid	Conversion	15	03-20-2011 06:39 PM
Text alignment	James_Wilde	iRiver Story	0	10-25-2010 05:22 AM

09-23-2014, 01:29 PM	#3
odedta Addict Posts: 398 Karma: 96448 Join Date: Dec 2013 Device: iPad	The computed CSS shows exactly the CSS rules I applied to the html. I always use dir="rtl" since it's a must for EPUB3 validation. I also tried to ad the direction:rtl through inline styling and it didn't work.

09-24-2014, 07:53 AM	#7
odedta Addict Posts: 398 Karma: 96448 Join Date: Dec 2013 Device: iPad	Ah! Great information there Doitsu! Thank you very much for your help, i will keep on experimenting.

Advert

Advert