table in reader doesn't look like preview in Sigil

[gib65]

Hello,

I'm trying to edit my epub file in Sigil. I have a table that looks like the attached image to the left. At least, that's the way I want it to look. It does look that way in Sigil, but then when I upload my epub file to KDP, convert it to .mobi, then downloaded and view it, my table looks like the attached image to the right.

Below is the markup for my table as seen in Sigil. Can anyone see what needs to be changed so that the right image ends up looking like the left one?

<div style="text-align:center">
      <table border="0" cellpadding="0" cellspacing="0" style="border-collapse:collapse;margin:0 aut; width:98%; border-top-color:#000000; border-top-style:solid; border-top-width:1px; border-left-color:#000000; border-left-style:solid; border-left-width:1px; border-right-color:#000000; border-right-style:solid; border-right-width:1px; border-bottom-color:#000000; border-bottom-style:solid; border-bottom-width:1px;">
        <tbody>
          <tr>
            <td colspan="2" style="background-color:#999999; border-bottom-color:#000000; border-bottom-style:solid; border-bottom-width:1px; padding:7.15pt; vertical-align:middle">
              <p style="margin:0.00% 0.00%; text-align:justify"><img alt="http://www.mm-theory.com/icons/prin.gif" height="19" src="../Images/image00321.jpeg" width="12" /> <span style=" font-size:1.0rem">Principle: Computer Analogy of The Brain</span></p>
            </td>
          </tr>

          <tr>
            <td colspan="2" style="border-left-color:#000000; border-left-style:solid; border-left-width:0.5pt; border-right-color:#000000; border-right-style:solid; border-right-width:0.5pt; padding:3.55pt 7.15pt; vertical-align:middle">
              <p style="margin:0.00% 0.00%; text-align:justify"><span style=" font-size:1.0rem">The brain is like a computer and its MODs are like circuits in that:</span></p>
            </td>
          </tr>

          <tr>
            <td style="border-left-color:#000000; border-left-style:solid; border-left-width:0.5pt; padding-bottom:3.55pt; padding-top:3.55pt; vertical-align:top; width:14.25pt">
              <p style="margin:0.00% 0.00%; text-align:right"><span style=" font-size:1.0rem">1)</span></p>
            </td>

            <td style="border-right-color:#000000; border-right-style:solid; border-right-width:0.5pt; padding:3.55pt 7.15pt; vertical-align:middle">
              <p style="margin:0.00% 0.00%; text-align:justify"><span style=" font-size:1.0rem">Logic gates permit some signals to pass through while inhibiting others</span><span style=" font-size:1.0rem">. Synapses permit some signals to pass through while inhibiting others.</span></p>
            </td>
          </tr>

          <tr>
            <td style="border-left-color:#000000; border-left-style:solid; border-left-width:0.5pt; padding-bottom:3.55pt; padding-top:3.55pt; vertical-align:top; width:14.25pt">
              <p style="margin:0.00% 0.00%; text-align:right"><span style=" font-size:1.0rem">2)</span></p>
            </td>

            <td style="border-right-color:#000000; border-right-style:solid; border-right-width:0.5pt; padding:3.55pt 7.15pt; vertical-align:middle">
              <p style="margin:0.00% 0.00%; text-align:justify"><span style=" font-size:1.0rem">Logical expressions can be physically represented with the activity of computer circuits. Logical thinking can be physically represented with the activity of MODs.</span></p>
            </td>
          </tr>

          <tr>
            <td style="border-left-color:#000000; border-left-style:solid; border-left-width:0.5pt; padding-bottom:3.55pt; padding-top:3.55pt; vertical-align:top; width:14.25pt">
              <p style="margin:0.00% 0.00%; text-align:right"><span style=" font-size:1.0rem">3)</span></p>
            </td>

            <td style="border-right-color:#000000; border-right-style:solid; border-right-width:0.5pt; padding:3.55pt 7.15pt; vertical-align:middle">
              <p style="margin:0.00% 0.00%; text-align:justify"><span style=" font-size:1.0rem">Computer circuits control the behavior of robots. Brains control the behavior of humans.</span></p>
            </td>
          </tr>

          <tr>
            <td style="border-bottom-color:#000000; border-bottom-style:solid; border-bottom-width:0.5pt; border-left-color:#000000; border-left-style:solid; border-left-width:0.5pt; padding-bottom:3.55pt; padding-top:3.55pt; vertical-align:top; width:14.25pt">
              <p style="margin:0.00% 0.00%; text-align:right"><span style=" font-size:1.0rem">4)</span></p>
            </td>

            <td style="border-bottom-color:#000000; border-bottom-style:solid; border-bottom-width:0.5pt; border-right-color:#000000; border-right-style:solid; border-right-width:0.5pt; padding:3.55pt 7.15pt; vertical-align:middle">
              <p style="margin:0.00% 0.00%; text-align:justify"><span style=" font-size:1.0rem">Computers process information as Boolean values (1s and 0s). Brains process information as Boolean values (neurons firing and not firing).</span></p>
            </td>
          </tr>
        </tbody>
      </table>
    </div>

[JSWolf]

Mobi (aka Mobipocket) does not do tables. The best way to do it for a Mobi is to use a graphic image of the table. KF8 will do tables. So you'll have to figure out the media queries to setup things so the KF8 has a real table and the Mobi has the graphic image.

[mrmikel]

Plus see the thread directly above re tables in epubs. It takes a few pushes of the font size button to blow up any html table.

[RbnJrg]

Originally Posted by gib65

Hello,

I'm trying to edit my epub file in Sigil. I have a table that looks like the attached image to the left. At least, that's the way I want it to look. It does look that way in Sigil, but then when I upload my epub file to KDP, convert it to .mobi, then downloaded and view it, my table looks like the attached image to the right.

Do the following:

1. In your stylesheet.css file, write:

table {
   border-collapse:collapse;
   border: 2px solid black;
}

th {
   border: 2px solid black;
   line-height: 2em;
   text-align: left;
   font-weight: bold;
   padding: 0.5em 2.5em;
   background: url("../Images/Smiley.png") 0.5em center no-repeat;
   background-size: 1.5em 1.5em;
   background-color: #CCC;
}

td {
   padding: 0 15px;
}

p, li {
   text-align: justify;
}

li {
   margin-bottom: 1em;
}

2. In your .html file write:

<table>
    <tr>
      <th>Principle: Computer Analogy of the Brain</th>
    </tr>

    <tr>
      <td>
        <p>The brain is like a computer and its MODs are like circuits in that:</p>

        <ol>
          <li>Logic gates permit some signals to pass through while inhibiting others. Synapses permit some signals to pass through while inhibiting others.</li>

          <li>Logical expressions can be physically represented with the activity of computer circuits. Logical thinking can be physically represented with the activity of MODs.</li>

          <li>Computer circuits control the behavior of robots. Brains control the behavior of humans.</li>

          <li>Computers process information as Boolean values (1s and 0s). Brains process information as Boolean values (neurons firing and not firing).</li>
        </ol>
      </td>
    </tr>
</table>

This is how the table looks in ADE:


This in the .kf8 format:


and this for the old mobi format:


Below I attach the respective ePub (of course, you'll have to change the small image in the table header ).

Regards
Rubén

EDIT: It wouldn't be a bad idea to use:

p, li {
   text-align: justify;
   font-size: 80%; /* or 90% */
}

instead of only:

p, li {
   text-align: justify;
}

[DaleDe]

Actually old mobi (KF7) does support tables anyway. Not all of the formatting is supported and tables cannot be nested but it does support them.

by the way Sigil would have crunched the table like the solution above had you narrowed the window a bit.

[gib65]

Thanks everyone. These are great solution.

[Hitch]

Originally Posted by DaleDe

Actually old mobi (KF7) does support tables anyway. Not all of the formatting is supported and tables cannot be nested but it does support them.

by the way Sigil would have crunched the table like the solution above had you narrowed the window a bit.

Dale:

AFAIK, the very original Kindle (and the first UK Kindle) didn't (support tables) at all. Nada. And the K2 would "forget" that a table formatting existed, if a table was longer than a single page, and the table formatting would become all jumbled on the second "page" or screen. Now, I believe that the latter problem on the K2 was fixed with a firmware update, but I think the original Kindles still, to this day, don't support tables. TBH, I don't have one (I know-gasp!), so I can't test it, but that's always been my understanding.

Hitch

[DaleDe]

Originally Posted by Hitch

Dale:

AFAIK, the very original Kindle (and the first UK Kindle) didn't (support tables) at all. Nada. And the K2 would "forget" that a table formatting existed, if a table was longer than a single page, and the table formatting would become all jumbled on the second "page" or screen. Now, I believe that the latter problem on the K2 was fixed with a firmware update, but I think the original Kindles still, to this day, don't support tables. TBH, I don't have one (I know-gasp!), so I can't test it, but that's always been my understanding.

Hitch

Interesting, must be something earlier than KF6 even. It would be good to nail this down. Pure mobi has supported tables for a long time but I never owned a K1 device.

Dale

[Hitch]

Originally Posted by DaleDe

Interesting, must be something earlier than KF6 even. It would be good to nail this down. Pure mobi has supported tables for a long time but I never owned a K1 device.

Dale

Well, hell...if we're gonna find one, it'll be here, most likely. I'll ask over in the K forum. Who knows? I am fairly sure...I think I had a UK customer in...2009...that had a K that couldn't display a table. And an American customer, ditto. However, my brains have rotted since then.

And I know factually, from sad experience, about the K2-page-flip issue. I still have a K2. I think it has the firmware upgrade, but I clearly recall the table formatting scrambling like eggs for an omelet once you flipped the "page" on a table. T'was a sad sight, lemme tell ya. TBH, I haven't tried any table longer than 10 rows--it's sort of our "rule," 3 columns, 10 rows as a table--since then. I mean, not for any book destined for Amazon, and they all are. I've never assumed that the original table problem was fixed all across the board.

Hitch

[DaleDe]

Originally Posted by Hitch

Well, hell...if we're gonna find one, it'll be here, most likely. I'll ask over in the K forum. Who knows? I am fairly sure...I think I had a UK customer in...2009...that had a K that couldn't display a table. And an American customer, ditto. However, my brains have rotted since then.

And I know factually, from sad experience, about the K2-page-flip issue. I still have a K2. I think it has the firmware upgrade, but I clearly recall the table formatting scrambling like eggs for an omelet once you flipped the "page" on a table. T'was a sad sight, lemme tell ya. TBH, I haven't tried any table longer than 10 rows--it's sort of our "rule," 3 columns, 10 rows as a table--since then. I mean, not for any book destined for Amazon, and they all are. I've never assumed that the original table problem was fixed all across the board.

Hitch

I, too, try to keep tables on one page even on ePub for best results. Making two tables is better than a too large one.

Dale

[DiapDealer]

Originally Posted by DaleDe

Interesting, must be something earlier than KF6 even. It would be good to nail this down. Pure mobi has supported tables for a long time but I never owned a K1 device.

Dale

It wasn't really any incarnation of the mobi format itself that didn't support tables (as you noted), but rather it seemed to be a limitation of the K1 device's rendering capabilities.

[Hitch]

Originally Posted by DiapDealer

It wasn't really any incarnation of the mobi format itself that didn't support tables (as you noted), but rather it seemed to be a limitation of the K1 device's rendering capabilities.

Yes, as far as I know, but, man...them's some old brain cells back there that I'm trying to revive.

H