Mobileread
Using bullet point image in EPUB
#1  increase 02-13-2020, 12:37 PM
I am using bullet point images and used
<img src="../Images/Bullet_point_blue.png" width="20" height="20" align="text-top" style="font-size: 1em; text-indent: 0em;"/>

But Sigil does not like the align, how can I wrap the text after the bullet image so that is is centered properly?
Reply 

#2  DiapDealer 02-13-2020, 12:40 PM
Nothing to do with Sigil. Sigil neither likes nor dislikes the alignment.

EPUB, however, does not allow the use of 'align="text-top"' in general. It's not valid xhtml.

Moving this to the Epub forum.
Reply 

#3  Quoth 02-13-2020, 12:51 PM
Best to define a css style and use that either in p, span, div or img tags as appropriate.
Reply 

#4  increase 02-13-2020, 12:57 PM
Quote FrustratedReader
Best to define a css style and use that either in p, span, div or img tags as appropriate.
Yes you are right, so for anyone else, it was this

<img class="”imgLeft”" src="../Images/Bullet_point_blue.png" width="20" height="20" style="font-size: 1em; text-indent: 0em;"/>

and css add
imgLeft {

float: left;

padding: 5px;

width: 30%;

height: auto;

display: block;

}
Reply 

#5  RbnJrg 02-13-2020, 02:48 PM
Quote increase
I am using bullet point images and used
<img src="../Images/Bullet_point_blue.png" width="20" height="20" align="text-top" style="font-size: 1em; text-indent: 0em;"/>

But Sigil does not like the align, how can I wrap the text after the bullet image so that is is centered properly?
You are employing a completly wrong code. You should use the css property "list-style-image". For example:

Code
ul { list-style-image: url("../Images/Bullet_point_blue.png");
}
Try that.

Regards
Reply 

#6  Quoth 02-13-2020, 03:21 PM
Sometimes in a ebook it's better to use user constructed fake lists without the ul and related list elements. I'd always use the ul approach on a website.
Reply 

#7  DNSB 02-13-2020, 06:57 PM
Quote increase
I am using bullet point images and used
<img src="../Images/Bullet_point_blue.png" width="20" height="20" align="text-top" style="font-size: 1em; text-indent: 0em;"/>

But Sigil does not like the align, how can I wrap the text after the bullet image so that is is centered properly?
Out of curiosity, what units are you using for width and height? 20 is meaningless without the units (cm, px, pt, whatever) or %. Using absolute values (width=20px for example) is bad since the image can be overlarge on a low resolution screen and too small on a high resolution screen. Check any decent site for the width and height properties.
Reply 

#8  hobnail 02-14-2020, 11:13 AM
Quote FrustratedReader
Sometimes in an ebook it's better to use user constructed fake lists without the ul and related list elements.
But when?
Reply 

#9  DNSB 02-14-2020, 02:52 PM
Quote hobnail
But when?
Pretty much anytime that a list is used.
Reply 

#10  Turtle91 02-14-2020, 06:47 PM
Quote DNSB
Pretty much anytime that a list is used.
I would amend this statement slightly.... Pretty much anytime that a list is used IF your targeted selling platform has issues with list items.

That requires a little research to determine. The safe route would be to manually build the non-list. I'm more of a rebel however. I would use the standard html tags as designed. They are supposed to be supported in a standards compliant device/app. If customers complain, then the fault can be laid at the foot of the device/app maker to support the standards. It is only by this method that they will be pushed to maintain standards. Of course, I don't have to deal with pesky little things like customers and sales...
Reply 

  Next »  Last »  (1/2)
Today's Posts | Search this Thread | Login | Register