[Solved] How to add background text color?

Design help General
1

Hey guys, would somebody teach me how to add a background color to the text, like in this images?

My research pointed that I should use a span, but I don’t even know how to actually implement it.

Regards,
Diogo Faim

2

Hi DiogoFaim,

just apply a class to your text, headline a.s.o.

Then change the “display setting” to inline block.

After that just apply a background-color to that class, and voila …
(with the help of padding you can add some space between the font and the background boundaries.

IMG:

237×762 24.1 KB

Cheers
Daniel

3

Hi Daniel, thanks for the fast reply.

I tried what you said but the background color extended after the text finished. The desired result came with the display setting “inline”. But by doing so, I lost control over the text padding and margin, which began to show some weird results. The solution was to use the text container’s padding options instead.

Here’s what I got:

1003×201 165 KB

Really appreciate your help, wouldn’t manage that by myself.

Cheers,
Diogo Faim

4

Could you please provide a public link?