White semi transparent box with text over featured image

[Steig]

Hello,

I’ve set a featured image and made it full screen. Then in the page header, I’ve put text, which doesn’t show real well because of the background image.

I’ve seen other sites fix this by putting a white semi transparent box behind the text. It allows the text to be seen better yet allows the background image to be seen.

How can I do this?

Thanks
Steig

GeneratePress 1.3.46

[Tom]

In your Page Header content, wrap your text in a div:

<div class="semi-white-bg">
    Your text in here
</div>

Then add CSS:

.semi-white-bg {
    background-color: rgba( 255,255,255, 0.5 );
    padding: 20px;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts