Preview shows hr lines differently

patrik · 02-09-2019, 09:27 AM

I noticed that two horizontal lines, with the same code, looked different in Sigil Preview. One line was thicker than the other.

But on my ereaders & in Calibre they were the same. Also the same in Sigil book view.

More of a curiosity, but I thought I would mention it.

html:

<h1>Title</h1>

<hr class="w50" />

<h2>Subtitle</h2>

<hr class="w50" />

css:

h1 { text-align:center; }

h2 { text-align:center; font-size:2em; }

hr.w50 { height:0.1em; border:white; background-color:black; width:50%; margin-left:25%; }

After testing I noticed it's the font-size element in h2 that makes the difference. If I set the size to 1em, the lines are the same. If I set it to something larger than 1, it gets thicker, but stays the same for any larger font-sizes.

(Sigil 0.9.10 on Linux)

GrannyGrump · 02-12-2019, 04:46 AM

Setting your height and border-thickness in pt or px (I know, I know... but this is *not* for setting text!) should give more consistent appearance. Anyway, that's how it seems to work for me.

Setting it in em will vary with font-size.

Code:

hr, .hr100
{
border-top:  2pt solid blue;
border-left: none;
border-right: none;
border-bottom: none;
height: 2pt;
margin-top: 1em;
margin-bottom: 1em;
margin-left:0;
margin-right:0;
}

patrik · 02-12-2019, 06:17 AM

Thank you GrannyGrump.

If I understand you correctly, you have found that it's a sort of best practice to use pt/px for hr? Considering how many very nice formatted books you have made, I will adopt that.

For this particular case, my guess is that there is a bug in the Sigil Previewer. I may be wrong, but that is the only place that does show the lines differently (compared to the ereaders and other software I tested with).

It doesn't matter much I guess, I just wanted to mention it since the amazing Sigil-duo seem to squash bugs in seconds.

(And if I did something wrong or "stupid" I hoped for feedback on that. Your post made my post worth it, thanks.

)

02-09-2019, 09:27 AM	#1
patrik Guru Posts: 682 Karma: 4568205 Join Date: Jan 2010 Location: Sweden Device: Kobo Forma	Preview shows hr lines differently I noticed that two horizontal lines, with the same code, looked different in Sigil Preview. One line was thicker than the other. But on my ereaders & in Calibre they were the same. Also the same in Sigil book view. More of a curiosity, but I thought I would mention it. html: <h1>Title</h1> <hr class="w50" /> <h2>Subtitle</h2> <hr class="w50" /> css: h1 { text-align:center; } h2 { text-align:center; font-size:2em; } hr.w50 { height:0.1em; border:white; background-color:black; width:50%; margin-left:25%; } After testing I noticed it's the font-size element in h2 that makes the difference. If I set the size to 1em, the lines are the same. If I set it to something larger than 1, it gets thicker, but stays the same for any larger font-sizes. (Sigil 0.9.10 on Linux) Attached Thumbnails

02-12-2019, 04:46 AM	#2
GrannyGrump Obsessively Dedicated... Posts: 3,221 Karma: 35037583 Join Date: May 2011 Location: PA {back in the usa!} Device: Sony PRS-T2, ADE on PC	Setting your height and border-thickness in pt or px (I know, I know... but this is not for setting text!) should give more consistent appearance. Anyway, that's how it seems to work for me. Setting it in em will vary with font-size. Code: hr, .hr100 { border-top: 2pt solid blue; border-left: none; border-right: none; border-bottom: none; height: 2pt; margin-top: 1em; margin-bottom: 1em; margin-left:0; margin-right:0; } Last edited by GrannyGrump; 02-12-2019 at 04:49 AM.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Search results are showing up differently	BunnyGal	Library Management	5	07-11-2014 01:35 PM
File split sometimes shows more split lines	DrChiper	Editor	1	12-23-2013 05:38 PM
Touch Dark lines between lines of text	taming	Kobo Reader	12	06-13-2011 07:20 PM
Things appearing differently on Calibre preview and on reader	ficbot	Calibre	6	03-27-2009 04:05 AM
Intel shows UMPC/Origami preview	Bob Russell	Alternative Devices	14	03-08-2006 02:37 PM

02-12-2019, 06:17 AM	#3
patrik Guru Posts: 682 Karma: 4568205 Join Date: Jan 2010 Location: Sweden Device: Kobo Forma	Thank you GrannyGrump. If I understand you correctly, you have found that it's a sort of best practice to use pt/px for hr? Considering how many very nice formatted books you have made, I will adopt that. For this particular case, my guess is that there is a bug in the Sigil Previewer. I may be wrong, but that is the only place that does show the lines differently (compared to the ereaders and other software I tested with). It doesn't matter much I guess, I just wanted to mention it since the amazing Sigil-duo seem to squash bugs in seconds. (And if I did something wrong or "stupid" I hoped for feedback on that. Your post made my post worth it, thanks. )

Advert