Combining Italics And Normal Text In One Line Via CSS

SeaCanary · 02-09-2014, 05:52 AM

I want to accomplish this...

Bonney Light Horseman

... without having to do this.

Code:

<b>B<i>onney </i>L<i>ight </i>H<i>orseman</i>

Can what I want to accomplish be done entirely within CSS?

Doitsu · 02-09-2014, 07:57 AM

Nope. There's no way to affect the appearance of individual letters in the middle of the text via CSS alone. The most you can do is the select the first letter or the first line using the :first-letter and :first-line pseudo elements.

However, most ePub readers don't support pseudo elements.

mrmikel · 02-09-2014, 09:43 AM

There has been some discussion in another thread on how it doesn't work right if there are too many changes in the first line. I have not at all checked out whether this would happen, but it is something to check out if you are doing your work for publication.

Jellby · 02-09-2014, 09:47 AM

This might be slightly more readable:

Code:

<b><i><i>B</i>onney <i>L</i>ight <i>H</i>orseman</i></b>

and, of course:

Code:

i i { font-style: normal }

cybmole · 02-09-2014, 10:36 AM

Quote:

Originally Posted by mrmikel

There has been some discussion in another thread on how it doesn't work right if there are too many changes in the first line. I have not at all checked out whether this would happen, but it is something to check out if you are doing your work for publication.

there's also the fact that it looks pretty awful, but hey, it's your book

02-09-2014, 05:52 AM	#1
SeaCanary Enthusiast Posts: 34 Karma: 10 Join Date: Jan 2014 Device: Nook	Combining Italics And Normal Text In One Line Via CSS I want to accomplish this... Bonney Light Horseman ... without having to do this. Code: <b>B<i>onney </i>L<i>ight </i>H<i>orseman</i> Can what I want to accomplish be done entirely within CSS?

02-09-2014, 09:47 AM	#4
Jellby frumious Bandersnatch Posts: 7,546 Karma: 19001583 Join Date: Jan 2008 Location: Spaniard in Sweden Device: Cybook Orizon, Kobo Aura	This might be slightly more readable: Code: <b><i><i>B</i>onney <i>L</i>ight <i>H</i>orseman</i></b> and, of course: Code: i i { font-style: normal }

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
combining text and image	Stephaan	Sigil	29	11-12-2013 10:38 AM
PDF italics yeilds line breaks	badgoodDeb	Conversion	3	01-12-2012 05:51 PM
Italics in Epub text	Jamestoo	Sigil	7	11-09-2011 03:16 AM
_notation_ in the text that indicates italics	alansplace	Calibre	2	07-20-2011 01:16 AM
changing text line-height in css	wjcroft	EPUBReader	0	12-15-2010 03:13 PM

02-09-2014, 07:57 AM	#2
Doitsu Grand Sorcerer Posts: 5,725 Karma: 24031401 Join Date: Dec 2010 Device: Kindle PW2	Nope. There's no way to affect the appearance of individual letters in the middle of the text via CSS alone. The most you can do is the select the first letter or the first line using the :first-letter and :first-line pseudo elements. However, most ePub readers don't support pseudo elements.

02-09-2014, 09:43 AM	#3
mrmikel Color me gone Posts: 2,089 Karma: 1445295 Join Date: Apr 2008 Location: Central Oregon Coast Device: PRS-300	There has been some discussion in another thread on how it doesn't work right if there are too many changes in the first line. I have not at all checked out whether this would happen, but it is something to check out if you are doing your work for publication.

Advert

Advert