Unable to add a small space below h5 tag

[Tribulatio]

I am currently building a new site (in staging, for this reason I cannot provide the link here) in which I have several pages with identical listings. For each segment in the list, I am using a h5 title, create with a shortcode allowing me to make easy changes.

I have formatted everything in that h5 title as I wanted to, adjusting the CSS for that purpose:

h5 {
	font-size: 16px;
	font-size: 1.6rem;
	border-bottom: 1px solid indigo;
        display: inline;
}

The only (small) problem that I have is that I would like to have a slightly larger space between the h5 subtitle and the items below it.

However, although I have been able to reach everything else that I wanted to do, all my attempts to find a trick in order to do that over the past two hours have failed. I have tested with margin-bottom, padding-bottom, with em, with px, in various sizes - nothing changes.

I guess that there is some higher-ranking code in Lifestyle Pro that is preventing me to change that - I assume that margin-bottom would be the right way to do it.

I would be interested to know if my guess is correct and if there an easy way to do it? Otherwise, I can live with what I have done - just attempting to make it still better, and to learn something for future similar cases.

[Victor Font]

Please post a link to the site so we can see what's going on with the CSS.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[Tribulatio]

I had not posted a link because it is in staging and I do not want search engines to spider it (it is a rebuilding of a former, non-WP site). If there is no risk of that happening, kindly let me know.

[Tribulatio]

I have now been able to reach exactly what I wanted to: by using the well-maintained plugin Spacer (https://wordpress.org/plugins/spacer/). It works perfectly.

Of course, I have been careful to check in multiple browsers. Strangely, the space was fine (without Spacer, but with the border-bottom having vanished) in the little-known browser Brave. But it didn't work in most browser (Safari, Chrome, Firefox, IE, etc.). Still, I have been careful to insert a small space, in order not to create havoc in case the behavior of other browsers changes some day. Any way, since each instance is generated by a shortcode plus CSS, I can at any time easily adjust to changes that might take place.

I was pretty confident that there would be a plugin doing the trick! But it took me time to find it. I hope that it can be useful to other users as well!

[Author]

Posts