CSS/HTML question
 

I'm trying to duplicate the effect where a heading has some text justified to the left followed by some blank space, and then some text justified to the right, all on the same line (see circled area on attached image).

My instinct would be to create a single-row table with two cells. However, I know that pre-KF8 mobi files struggle with tables (I don't know how well KF8 deals with them). My question then is this: is there another way to achieve that formatting effect, and if not, does anyone know how well a KF8 conversion from epub in Calibre renders tables (for display on a Kindle device). I realize this is a little convoluted...

How's this ??

No guarantee that it will work on a mobi, but an alternative to a table

@mmat1 - veddy veddy clever. Thanks for that. I'm going to play around with that and the table option and see how they convert and render on a Kindle. FWIW, the KF8 conversion viewed through calibre's reader rendered just fine.

The ePub didn't work. One side was a line above the other.

weird....worked fine with me... Not only that, but it rendered perfectly on the kindle, even when the table wouldn't. What viewer were you using that made it render incorrectly? did you make any additions to the text?

Didn't work for me either in ADE; the right hand side seems to be a line above the left hand side.

I tried Mantano reader and it failed - right above the left.

Sure would like to see a solution to this problem.

Regards - John

Does this idea help? http://css-tricks.com/left-align-and...the-same-line/

This works fine in ADE
Attachment 89841

Sorry ...

It seemes to work well for me but i didn't check it fully. I got the same results with ADE as the others.

You should give PeterT's suggestion a try ...

Interesting... none except mmat's seems to render as intended in Sigil (or consequently in Calibre). likewise, the mobi/KF8 conversions don't render correctly. It seems you can either design the epub to display correctly in calibre (and its KF8 conversion to render correctly on Kindle), or you can design it to render correctly on ADE, but not both.

EDIT: Wrote bad code... got bad result. GIGO. ignore this post

sorry, but I get bad results on browser-based renderers.

this seams to be the solution, following the advice given by PeterT's link

(Tested with ADE ;) )

you misspelled the classname in your sample: "alightright"

a light right ?? :)

You're all rockstars. thanks for the help.

@mmat- yeah, i just figured that out myself.... feeling pret-tee dumb.

for the record, renders poifectly on a Kindle, using calibre's KF8 conversion.

Same as PeterT. I used ADE for Windows to view it. I did have a look at the code and I did notice that each header was supposed to be on a separate line as they both used paragraph level coding.