Title with underline

Pyjam · 08-19-2019, 05:17 PM

How can I do an underline like in the picture?
(I'm a newbie)

Using «*text-decoration: underline*» doesn't produce a nice result like this with a thick line and a large gap between the text and the line.

Thank you.

jackie_w · 08-19-2019, 08:26 PM

You could try HTML like

Code:

<h2><span class="decor">PREMIÈRE PARTIE</span></h2>

with CSS like

Code:

.decor {
    padding-bottom: 0.25em;
    border-bottom: 2px solid;
}

Adjust numeric values as desired for line thickness and padding between text and line.

Pyjam · 08-19-2019, 09:11 PM

Wonderful. Thanks a lot.

08-19-2019, 05:17 PM	#1
Pyjam Zealot Posts: 143 Karma: 15920 Join Date: Aug 2015 Device: Kindle Voyage	[Solved] Title with underline How can I do an underline like in the picture? (I'm a newbie) Using «text-decoration: underline» doesn't produce a nice result like this with a thick line and a large gap between the text and the line. Thank you. Attached Thumbnails Last edited by Pyjam; 08-19-2019 at 09:12 PM.

08-19-2019, 08:26 PM	#2
jackie_w Grand Sorcerer Posts: 6,212 Karma: 16534894 Join Date: Sep 2009 Location: UK Device: Kobo: KA1, ClaraHD, Forma, Libra2, Clara2E. PocketBook: TouchHD3	You could try HTML like Code: <h2><span class="decor">PREMIÈRE PARTIE</span></h2> with CSS like Code: .decor { padding-bottom: 0.25em; border-bottom: 2px solid; } Adjust numeric values as desired for line thickness and padding between text and line.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
How to underline all <h2> tags?	crankypants	ePub	12	12-03-2015 01:17 PM
Useless without underline	Quetzalcoatlus	EPUBReader	0	04-12-2014 01:30 AM
Image links without underline	slicknick001	Kindle Formats	17	12-20-2013 07:16 AM
Underline	magavi	Devices	5	06-21-2013 01:08 PM
Colored quotes -> underline	Coruscatus	Conversion	3	11-18-2012 07:30 PM

08-19-2019, 09:11 PM	#3
Pyjam Zealot Posts: 143 Karma: 15920 Join Date: Aug 2015 Device: Kindle Voyage	Wonderful. Thanks a lot.

Advert