Problem with tables

[RbnJrg]

Originally Posted by DanaRu

Tell me, please, what should I do for the photo?

Well, you need to do several things if you plan to include a picture in a cell of a table:

1) First, you need to set the width of the cell according with the width of the image. For example, if you plan that the width of the image will be the 50% of the screen, then you'll need to set the width of the cell as 50% of the screen too.

2) After that, you'll have to give the image a width of 100% (so the image will full the width of the cell; and as the cell it has a width of 50% of the screen, then the width of the image will be also 50% of the screen).

3) To include your image in the cell you mustn't use the following code (in your .xhtml file):

<td class="My_Width">
       <img class="My_Img" alt="" src="../Images/your_image.jpg" />
</td>

and in the .css stylesheet:

.My_Width {
     width: 50%;
}

.My_Img {
     width: 100%;
}

The above code is correct, but it has issues under iPhone/iPad. So, as workaround, you have to use the following code:

<td class="My_Width">
    <div class="My_Img">
           <img alt="" src="../Images/your_image.jpg" />
    </div>
</td>

That code will work (or it should ).

And regarding your issue with the table whose screenshot you attached in your last post, can you post here the code for that table? (the .html code and the .css you used).

Regards
Rubén

EDIT: Hmmm, after studying a bit your table, I saw it has long numbers. That's a problem. You'll have to reduce the width of the first, fourth and last columns and maybe reduce a bit the cells padding. But post the code of your table and I'll be able to give you a more accurate opinion.

By the way, I saw that you are building an ebook of cientific nature; do you have in it many mathematical formulas? If so, you could consider to write your epub as epub3 and to employ MathML (the alternative is to write the epub as epub2 and to employ images -.png or preferably .svg- for the formulas).

[DanaRu]

Originally Posted by RbnJrg

Well, you need to do several things if you plan to include a picture in a cell of a table:

Is it only for images in a table cell?

Originally Posted by RbnJrg

EDIT: Hmmm, after studying a bit your table, I saw it has long numbers. That's a problem. You'll have to reduce the width of the first, fourth and last columns and maybe reduce a bit the cells padding. But post the code of your table and I'll be able to give you a more accurate opinion.

Yes of course.
I know it does not look very good .. but I have a lot of different tables, so I can not spend a lot of time on each (
This is another table (not the one on the screen), but it also looks bad in ADE
I also attached a full epub book, maybe it will help

<table class="tablemobile">
<caption>Состав пантов сибирской косули и пятнистого оленя, %</caption>
	<tbody>
		<tr>
			<td rowspan="2" style="text-align: center;"><span style="font-weight: bold;">Показатели</span></td>
			<td colspan="4" style="text-align: center;"><span style="font-weight: bold;">Панты сибирской косули</span></td>
			<td colspan="4" style="text-align: center;"><span style="font-weight: bold;">Панты пятнистого оленя (двухконцовые)</span></td>
		</tr>
		<tr>
			<td style="text-align: center;"><span style="font-weight: bold;">комель</span></td>
			<td style="text-align: center;"><span style="font-weight: bold;">средняя часть ствола</span></td>
			<td style="text-align: center;"><span style="font-weight: bold;">вершина</span></td>
			<td style="text-align: center;"><span style="font-weight: bold;">средняя для панта</span></td>
			<td style="text-align: center;"><span style="font-weight: bold;">комель</span></td>
			<td style="text-align: center;"><span style="font-weight: bold;">средняя часть ствола</span></td>
			<td style="text-align: center;"><span style="font-weight: bold;">вершина</span></td>
			<td style="text-align: center;"><span style="font-weight: bold;">средняя для панта</span></td>
		</tr>
		<tr>
			<td style="text-align: left;">Влага</td>
			<td style="text-align: center;">7,1</td>
			<td style="text-align: center;">6,8</td>
			<td style="text-align: center;">7,4</td>
			<td style="text-align: center;">7,0</td>
			<td style="text-align: center;">10.0</td>
			<td style="text-align: center;">9,5</td>
			<td style="text-align: center;">8,9</td>
			<td style="text-align: center;">9,5</td>
		</tr>
		<tr>
			<td style="text-align: left;">Плотное вещество</td>
			<td style="text-align: center;">92,9</td>
			<td style="text-align: center;">93,2</td>
			<td style="text-align: center;">92,6</td>
			<td style="text-align: center;">93,0</td>
			<td style="text-align: center;">90,0</td>
			<td style="text-align: center;">90,5</td>
			<td style="text-align: center;">91,1</td>
			<td style="text-align: center;">90,5</td>
		</tr>
		<tr>
			<td style="text-align: left;">Общая зола</td>
			<td style="text-align: center;">46,2</td>
			<td style="text-align: center;">40,8</td>
			<td style="text-align: center;">36,5</td>
			<td style="text-align: center;">39,96</td>
			<td style="text-align: center;">42,0</td>
			<td style="text-align: center;">35,2</td>
			<td style="text-align: center;">28,4</td>
			<td style="text-align: center;">35,6</td>
		</tr>
		<tr>
			<td style="text-align: left;">Органические вещества</td>
			<td style="text-align: center;">46,7</td>
			<td style="text-align: center;">52,4</td>
			<td style="text-align: center;">56,1</td>
			<td style="text-align: center;">53,1</td>
			<td style="text-align: center;">48,0</td>
			<td style="text-align: center;">55,3</td>
			<td style="text-align: center;">62,7</td>
			<td style="text-align: center;">54,9</td>
		</tr>
		<tr>
			<td style="text-align: left;">Азот общий</td>
			<td style="text-align: center;">4,66</td>
			<td style="text-align: center;">7,5</td>
			<td style="text-align: center;">8,21</td>
			<td style="text-align: center;">7,34</td>
			<td style="text-align: center;">–</td>
			<td style="text-align: center;">–</td>
			<td style="text-align: center;">–</td>
			<td style="text-align: center;">9,6</td>
		</tr>
		<tr>
			<td style="text-align: left;">Кальций</td>
			<td style="text-align: center;">16,52</td>
			<td style="text-align: center;">13,71</td>
			<td style="text-align: center;">12,7</td>
			<td style="text-align: center;">14,68</td>
			<td style="text-align: center;">14,4</td>
			<td style="text-align: center;">10,15</td>
			<td style="text-align: center;">6,04</td>
			<td style="text-align: center;">11,1</td>
		</tr>
		<tr>
			<td style="text-align: left;">Фосфор</td>
			<td style="text-align: center;">8,85</td>
			<td style="text-align: center;">7,89</td>
			<td style="text-align: center;">6,86</td>
			<td style="text-align: center;">7,49</td>
			<td style="text-align: center;">7.6</td>
			<td style="text-align: center;">5,35</td>
			<td style="text-align: center;">3,12</td>
			<td style="text-align: center;">5,92</td>
		</tr>
	</tbody>
</table>

Originally Posted by RbnJrg

By the way, I saw that you are building an ebook of cientific nature; do you have in it many mathematical formulas? If so, you could consider to write your epub as epub3 and to employ MathML (the alternative is to write the epub as epub2 and to employ images -.png or preferably .svg- for the formulas).

Yes you are right)
how can i write in epub3?
This format can read all the readers?

Thank you very much for the tips. I don't know where to turn anymore

[RbnJrg]

Originally Posted by DanaRu

Is it only for images in a table cell?

Yes, that's only for images in a table cell FOR IPAD. For all others ereaders things are simpler (a bit )

Yes of course.
I know it does not look very good .. but I have a lot of different tables, so I can not spend a lot of time on each...

Indeed For that reason is better to write the styles in a css file, because is easier to fix things for all the things.

This is another table (not the one on the screen), but it also looks bad in ADE
I also attached a full epub book, maybe it will help...

Great! I will watch your epub and I'll be able to give you better tips about how to write it.

Yes you are right)
how can i write in epub3?

It's just matter of selecting the appropiate option in Sigil (Edit --> Preferences... --> General Settings, and in the dialog, in the field "Create New or Empty Epubs as:" you must choose "Version 3"). Alternatively, you can convert an epub2 into epub3 with the Sigil plugin ePub3-itizer.

This format can read all the readers?

Good question MathML is supported for Kindle and Kobo (but not Nook). Under Android, the PocketBook app supports perfectly MathML (and epub3), so anyone with a smathphone, tablet or e-ink tablet with Android will be able to read your epub (if s/he install PocketBook). Finally, Apple devices also support MathML. But all old e-ink devices (Sony, Nook, etc.) won't be able to read your formulas if you employ MathML. So if you aim to a vast ereader market, then your best choice is to write an epub2 with .png images as formulas (the better is to employ .svg images but Nook has issues with that kind of image).

Thank you very much for the tips. I don't know where to turn anymore

You are welcome Dana I'll study your last table and your epub and will give you my opinion about how to fix your issues.

Regards
Rubén

[RbnJrg]

Hi Dana;

I watched your epub and I made some tiny changes. Open it with ADE and tell me what you think. Still there would be some tweeks with tables but as I don't know your idiom (barely I know spanish ) I couldn't apply the better alternative to fix the tables. Below I attach you book (are you a biology professor?) with some modifications; you'll see if you like them

Regards
Rubén

[DanaRu]

Originally Posted by RbnJrg

Hi Dana;

I watched your epub and I made some tiny changes. Open it with ADE and tell me what you think. Still there would be some tweeks with tables but as I don't know your idiom (barely I know spanish ) I couldn't apply the better alternative to fix the tables. Below I attach you book (are you a biology professor?) with some modifications; you'll see if you like them

Hi Rubén!


I looked at the book. Everything is perfect! I do not know how to thank you!))
I am glad that there are no errors and the code was looked by an experienced person) Can I write to you if you have more questions?

You have a very beautiful and neat code! Now I will do like you)

Originally Posted by RbnJrg

are you a biology professor?

No, I am a layout designer)) I work in a publishing house. Our publisher publishes books for students)


Eres muy simpático! Gracias Rubén

[RbnJrg]

Originally Posted by DanaRu

Hi Rubén!

Hi Dana!

I looked at the book. Everything is perfect! I do not know how to thank you!))

You are welcome Dana.

I am glad that there are no errors and the code was looked by an experienced person) Can I write to you if you have more questions?

Yes, of course, you can write me. Take in count that now the text in your tables won't resize because otherwise, if the user increases the font-size, the tables won't look well (as you observed with your first intents).

Besides, there are others things I would change in your epub. I didn't want to do it because it seemed a lack of respect toward your work but if I were you, I would change some things regarding your embbeding fonts. I wouldn't set a font for <body> and regarding your <h> tags (you are using Arial as font for them), I'd employ the following:

h1, h2, h3 {
   font-family: sans-serif;
}

So, I would suppress from the epub the fonts "Times" and "Arial". Why? Because is the user who must choose what fonts prefers to read the book. And if you like a serif font for the text of the ebook, then use something like:

p {
   font-family: serif;
}

Of the same way, don't use margins for body; let the users to choose that; IMHO, of course.

You have a very beautiful and neat code! Now I will do like you)

Glad the my way of writting code likes you By the way, it seems to me that you are using Sigil to write epubs in Book View; am I right?

No, I am a layout designer)) I work in a publishing house. Our publisher publishes books for students)

Ok.

Eres muy simpático! Gracias Rubén

Не за что, Дана. И вы тоже очень добры и у вас много сочувствие.

[DanaRu]

Buenas tardes!)

Originally Posted by RbnJrg

Take in count that now the text in your tables won't resize because otherwise, if the user increases the font-size, the tables won't look well (as you observed with your first intents).

Can I then use percentages for the fonts in the table?

Originally Posted by RbnJrg

Besides, there are others things I would change in your epub.

Yes, of course, you can tell me what you think) until I made a lot of books

Originally Posted by RbnJrg

So, I would suppress from the epub the fonts "Times" and "Arial". Why? Because is the user who must choose what fonts prefers to read the book. And if you like a serif font for the text of the ebook, then use something like:

This is a good idea. I'll ask my editor

Originally Posted by RbnJrg

Of the same way, don't use margins for body; let the users to choose that; IMHO, of course.

on all devices, the user can select margins? can leave the margins?)

Originally Posted by RbnJrg

Glad the my way of writting code likes you By the way, it seems to me that you are using Sigil to write epubs in Book View; am I right?

I will briefly tell you how I am doing the books) I have a ready .doc, where the text is correct. I take this text and convert it to html (I use this site https://html-cleaner.com/) remove all unnecessary and put it in a Sigil...

[HarryT]

Originally Posted by DanaRu

I will briefly tell you how I am doing the books) I have a ready .doc, where the text is correct. I take this text and convert it to html (I use this site https://html-cleaner.com/) remove all unnecessary and put it in a Sigil...

Try saving your file as DOCX, then converting to ePub using Calibre. That may give you better results.

[DanaRu]

Originally Posted by HarryT

Try saving your file as DOCX, then converting to ePub using Calibre. That may give you better results.

Good afternoon, Harry!
Thanks for the advice! I'm going to try now

[DanaRu]

Rubén

text-transform: uppercase; in h1 does not work(
What do I need to do? I do not see this style in ADE
example book

[RbnJrg]

Originally Posted by DanaRu

Buenas tardes!)

Hi Dana; good afternoon to you too (now in my country is 3:30 pm)

Can I then use percentages for the fonts in the table?

No, you can't Because using percentage for font-size is the same as "em". To be sure that your tables remains the same (no matter the font-size choosing by the user) you should use "px".

Yes, of course, you can tell me what you think) until I made a lot of books.

I'll do one thing. I'll change your books with all the things I think would be better and I will upload here so you can study it. However, as my russian is not as good there are some things that I won't be able to optimize. Very probably this Sunday I can upload your epub with my changes.

on all devices, the user can select margins? can leave the margins?)

Yes, that's so. Users can select margins. And it would be a very good idea if you don't set margins for <body>.

I will briefly tell you how I am doing the books) I have a ready .doc, where the text is correct. I take this text and convert it to html (I use this site https://html-cleaner.com/) remove all unnecessary and put it in a Sigil...

Well, I read Harry told you something. Another choice for you is to use the DOCXImport Sigil plugin:

https://www.mobileread.com/forums/sh...d.php?t=273966

So, you can save your book in .docx format and then to use the Sigil plugin to generate an epub. That, or using Calibre as Harry told you. But Calibre builds epubs with a code "not so neat" to my taste.

[RbnJrg]

Originally Posted by DanaRu

Rubén

text-transform: uppercase; in h1 does not work(
What do I need to do? I do not see this style in ADE
example book

Yes, Dana. There are many things that ADE doesn't support (even being the standart) for epub2 (another thing is epub3; there ADE supports that property). In those cases, you must write the text with capitals letters; you don't have another choice.

You would do good by reading the following thread:

https://www.mobileread.com/forums/sh...ad.php?t=94733

Another things you must know is that ADE supports properties that the vast majory of ereaders don't. For example, you were using:

page-break-after: avoid;
page-break-inside: avoid;

Well, ADE supports those properties, but any ereader not based on RMSDK (the ADE engine) won't do it. So you must consider that eventuality when are going to employ them. As workaround, you could play with the property "display: inline-block" but implementing it properly is "not so easy" for long block of text.

[BetterRed]

Originally Posted by RbnJrg

<snip>
Well, I read Harry told you something. Another choice for you is to use the DOCXImport Sigil plugin:

https://www.mobileread.com/forums/sh...d.php?t=273966

So, you can save your book in .docx format and then to use the Sigil plugin to generate an epub. That, or using Calibre as Harry told you. But Calibre builds epubs with a code "not so neat" to my taste.

↑ ↑ ↑ ✔️

@DanaRu - if you have Word 2007 or later, another choice would be Toxaris' ePub Tools addin for Word, it will create a pretty good epub, and hook directly into Sigil ==>> e-Book Tools - a Word add-in

And it has several other useful features.

BR

[RbnJrg]

Hi Dana;

Here I attach the last epub you uploaded with some changes. Watch them and you'll say

Regards
Rubén

EDIT: Watch your Styles.css file to read a list of the changes I made.

[DanaRu]

Originally Posted by BetterRed

↑ ↑ ↑ ✔️

@DanaRu - if you have Word 2007 or later, another choice would be Toxaris' ePub Tools addin for Word, it will create a pretty good epub, and hook directly into Sigil ==>> e-Book Tools - a Word add-in

And it has several other useful features.

BR

Hello!
Thanks for the advice, I'm trying this way)