fill out line (line next to text)

[Toxaris]

I am trying to achieve this effect, but it doesn't really work out like I want to. No problem in Sigil and Calibre of course, but not in ADE and I want it also to work there as this gives a little more chance it will work on a reader.
The effect I am after is:


The only way I seem to make it work is via a table and ugly code. There must be something easier that is still ePUB2 compliant...

[RbnJrg]

Originally Posted by Toxaris

I am trying to achieve this effect, but it doesn't really work out like I want to. No problem in Sigil and Calibre of course, but not in ADE and I want it also to work there as this gives a little more chance it will work on a reader.
The effect I am after is:


The only way I seem to make it work is via a table and ugly code. There must be something easier that is still ePUB2 compliant...

The following solution works fine for me under ADE:

1. In your .css stylesheet write:

h2 {
   text-align: right;
   margin-top: -1em;
   margin-bottom: 2.5em;
   font-size: 1.4em;
   border-bottom: 2px solid;
   height: 2em;
}

.text {
   float: right;
   width: 2.25em;
   line-height: 3em;
   font-size: 1.4em;
   font-family: serif;
   background: white !important;
}

p {
   text-align: justify;
   text-indent: 0em;
}

2. In your .xhtml file write:

<h2><span class="text">1999</span></h2>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ac tellus nunc. Phasellus imperdiet leo metus, et gravida lacus.</p>

This is how it looks under ADE 3.0:



Below you can check the respective epub.

Regards
Rubén

[Jellby]

Originally Posted by RbnJrg

background: white !important;

That's the problem I see. It will only work with white backgrounds.

But to avoid that I don't see at the moment any solution other that a table, or SVG.

[Toxaris]

The white backgrounds could be an issue, but it is elegant enough. It also works in ADE 1.7.2, which is my usual testing ground. Thanx!

[RbnJrg]

Originally Posted by Toxaris

The white backgrounds could be an issue, but it is elegant enough. It also works in ADE 1.7.2, which is my usual testing ground. Thanx!

You are welcome

[Tex2002ans]

Also had this topic, in which I asked a similar question dealing with text in the middle, with lines on either side:

https://www.mobileread.com/forums/sho...d.php?t=233587

[Toxaris]

Thank you! I do remember that topic but I was unable to find it.