[Resolved] how to use background colors for different elements

[Immi]

hello there,
How To Use Specify the background color in a post without spacing I have applied below code, but the problem is some gap with white color. I want to fill only by one color like this http://www.screencast.com/t/wYFqn9bw

h5 {
background-color: #f2f2f2;

}

GP Premium 1.7.2

[Leo]

Hi there,

Is there a specific section I should be looking at?

I’m not see the content in your screenshot on your page.

But two options for applying CSS to certain page:

1) Use Tom’s Simple CSS plugin so it gives you a CSS metabox for each page.

2) Do something like this:

.page-id-xx h5 {
    color: #fff;
}

Let me know if this helps 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Immi]

hello Leo,

I want to highlight some points in the post by a background color without spacing.

h5 {
background-color: #f2f2f2;

}

[David]

Hi there,

you’re gonna need to put some markup around it:

HTML

<div class="important-box">
    My content here
</div>

CSS

.important-box {
    background-color: #f2f2f2;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Immi]

Hello there,

I want to change the exact content background color/ box in some specific paragraph

like this:- **

[Leo]

David’s reply above should do exactly that.

Have you tried it?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Immi]

Yes, I have tried it. when putting HTML code error indicate can you please provide CSS code for this

[Leo]

David has provided both HTML and CSS and there are no errors in them.

Can you link me to the page where you’ve added this?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Immi]

Yes Please have a look **

[Leo]

That’s HTML and not PHP as David indicated above.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Immi]

can you tell me where to put this code exactly?

<div class="important-box">
    My content here
</div>

[Leo]

This should help: https://www.wpbeginner.com/glossary/text-editor/

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Immi]

Thank you

[Leo]

No problem 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Immi]

hello David Sir,
if I want to put another markup with the different background colour/Style so how to put another CSS for secondary markup.

I’m trying to achieve like following, but unfortunately, it’s not working.

.important-box (2){
padding: 20px 10px;
border-radius: 10px;
line-height:40px;
color: z black
box-shadow: .0em 05em 12em .01em #eee;
background: white;
}

[Author]

Posts