I have a list of items and I want to make the first letter bold. I used the "first-letter" pseudo class as documented in Flare Help. It works great when the first character in the paragraph is literally a letter but it chokes when the first character is a number. Ha!!
For example, in the screenshot below, in the first item in the list, I want the "1" to be bold but not the "A" in the word "Active". Notice that the last three paragraphs, beginning with "K", "M", and "Q", are all working fine. Is this a bug in the pseudo class? Anyone know how to fix this problem?
CSS Pseudo Class "first-letter" is literally "letter"
CSS Pseudo Class "first-letter" is literally "letter"
You do not have the required permissions to view the files attached to this post.
Matt Danda
MadCap Advanced Developer (MAD)
Overland Park, KS
MadCap Advanced Developer (MAD)
Overland Park, KS
Re: CSS Pseudo Class "first-letter" is literally "letter"
I think I figured out a solution, although it isn't the most elegant.
I created an additional style for when the first character is a number (instead of a letter). I do not use a pseudo-class with this style. I also create a character style for that number, in which I apply bold and the same "letter-spacing" value. The results are identical. The drawback is that I have to manually apply a whole lot more styles
In the example below, the first two lines use my "p.FieldOptionsNumber" style that does not use a pseudo-class but otherwise matches the "p.FieldOptions" style that has been applied to the last two lines. The last two lines use a pseudo-class to apply the bold to the first letter. The first two lines use an additional character style to apply the bold and add the extra spacing to the right of the initial character. A lot of clicks to apply styles, but it works.
I created an additional style for when the first character is a number (instead of a letter). I do not use a pseudo-class with this style. I also create a character style for that number, in which I apply bold and the same "letter-spacing" value. The results are identical. The drawback is that I have to manually apply a whole lot more styles
In the example below, the first two lines use my "p.FieldOptionsNumber" style that does not use a pseudo-class but otherwise matches the "p.FieldOptions" style that has been applied to the last two lines. The last two lines use a pseudo-class to apply the bold to the first letter. The first two lines use an additional character style to apply the bold and add the extra spacing to the right of the initial character. A lot of clicks to apply styles, but it works.
You do not have the required permissions to view the files attached to this post.
Matt Danda
MadCap Advanced Developer (MAD)
Overland Park, KS
MadCap Advanced Developer (MAD)
Overland Park, KS
Re: CSS Pseudo Class "first-letter" is literally "letter"
It looks like first-letter is a bug in Flare's editor and the PDF output, but it works fine in help (HTML5 or WebHelp) outputs.
In the meantime, I think it'd be a lot easier just to create a span class (with the bold and spacing) and apply that to all the the first letters/numbers; or maybe just organise it in a table.
In the meantime, I think it'd be a lot easier just to create a span class (with the bold and spacing) and apply that to all the the first letters/numbers; or maybe just organise it in a table.